先看jQuery hover源代码:
-----------------------------------------
(function($) {
$.fn.hoverDelay = function(fnOver, fnOut,timeIn,timeOut) {
var timeIn = timeIn || 200,
timeOut = timeOut || 200,
fnOut = fnOut || fnOver;
var inTimer = [],outTimer=[];
return this.each(function(i) {
$(this).mouseenter(function() {
var that = this;
clearTimeout(outTimer[i]);
inTimer[i] = setTimeout(function() {
fnOver.apply(that);
}, timeIn);
}).mouseleave( function() {
var that = this;
clearTimeout(inTimer[i]);
outTimer[i] = setTimeout(function() {
fnOut.apply(that)
}, timeOut);
});
})
};
})(jQuery);
--------------------------------------------------
实例:
--------默认值-------
$("li").hoverDelay(
function () {
$(this).addClass('green');
},
function () {
$(this).removeClass('green');
}
);
-------------------------------
$("li").hoverDelay(
function () {
$(this).addClass('green');
},
function () {
$(this).removeClass('green');
},1000,500
);
如有错误欢迎指出,共同学习。