防弹鼠标滚轮 [英] Debounce mouse wheel

问题描述

我正在构建一个自定义jQuery代码，以允许使用鼠标滚轮引导用户浏览网页.

I'm building a custom jQuery code to allow the user to be guided through a webpage by using the mousewheel.

我正在构建的代码与此页面相似:链接

The code I'm building is simulair to this page: Link

一切正常，但是默认情况下，mousewheel事件会触发多次，从而使脚本"skip"完成div并向下/向上滚动多次，而不是一次.

Everything works fine, but the mousewheel event fires multiple times by default, making the script 'skip' complete divs and scroll down/up multiple times, instead of just once.

我需要一种方法来限制鼠标滚轮只发射一次.在寻找答案的过程中，我发现本·阿尔曼的剧本使用反跳".

I need a way to limit the mousewheel to fire only once. In my quest of finding the answer I found Ben Alman's script wich uses 'debounce'.

我的问题是；有什么方法可以消除每个鼠标滚轮事件的抖动，而不是消除其功能?因此，从根本上讲，告诉鼠标滚轮"每500毫秒触发一次，而忽略该500毫秒内发送的所有触发信号.

My question here is; is there a way to debounce EVERY mousewheel event instead of debouncing it's function? So basicly telling 'mouse wheel' to fire once every 500ms, and ignore all fires that were send in that 500ms period.

推荐答案

如何使用setTimeout控制事件的触发-如:

How about using setTimeout to control the firing of events - as:

$("div").html((new Array(1000)).join(" test")).on("mousewheel DOMMouseScroll MozMousePixelScroll", function()
{
    if (!$(this).data('flag'))
    {
        var self = this;
        $(this).data('timeout', window.setTimeout(function()
        {
            $(self).data('flag', false);
        }, 500));

        $(this).data('flag', true);

        console.log('here');
    }
});

提琴: http://jsfiddle.net/aN4hU/

这篇关于防弹鼠标滚轮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！