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         鼠标移出执行的方法


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM