js 延迟执行(转)

<div id="aaa" style="height:200px; width:200px; background:#CCC;"></div>
<div id="bbb" style="height:200px; width:200px; background:#CFC;"></div>

<script src="http://upcdn.b0.upaiyun.com/libs/jquery/jquery-1.8.2.min.js"></script>
<script>
$.fn.hoverDelay = function(options){
	var defaults = {
		hoverDuring: 2000,
		outDuring: 2000,
		hoverEvent: $.noop,
		outEvent: $.noop
	};
	var sets = $.extend(defaults, options || {});
	return $(this).live("hover",function(event) {
		var that = this;
		if(event.type =="mouseenter"){
			clearTimeout(that.outTimer);
			that.hoverTimer = setTimeout(
			function(){sets.hoverEvent.apply(that)},
			sets.hoverDuring
		);
	}
	else 
	{
		clearTimeout(that.hoverTimer);
		that.outTimer = setTimeout(
		function(){sets.outEvent.apply(that)},
		sets.outDuring
	);
	}
	});
}

$("#aaa").hoverDelay({
    hoverEvent: function(){
        $("#bbb").html("进入");	
    },
	outEvent:function(){
		$("#bbb").html("离开");	
	}
});


</script>

  

posted @ 2014-12-08 13:20  skyhap  阅读(403)  评论(0编辑  收藏  举报