jQuery – 鼠标经过(hover)事件的延时处理
说到延时,离不开window下的setTimeout方法,本实例的jQuery方法的核心也是setTimeout。代码不长,完整如下:
(function ($) { $.fn.hoverDelay = function (hoverEvent, outEvent) { var hoverTimer, outTimer; return $(this).each(function () { $(this).hover(function () { var t = this; clearTimeout(outTimer); hoverTimer = setTimeout(function () { hoverEvent.call(t); }, 200); }, function () { var t = this; clearTimeout(hoverTimer); outTimer = setTimeout(function () { outEvent.call(t); }, 200); }); }); } })(jQuery);
基本上都是代码在撑页面,说点有用的东西吧。hoverDelay
方法共四个参数,表示意思如下:
hoverDuring 鼠标经过的延时时间
outDuring 鼠标移出的延时时间
hoverEvent 鼠标经过执行的方法
outEvent 鼠标移出执行的方法