如何检测用户何时正在主动滚动？

Question

我的页面有一个可滚动的区域，其中包含许多元素。每个元素在悬停时触发一个函数。

我的问题是，如果用户使用鼠标滚轮向上或向下滚动，则该功能将触发光标在区域滚动下方时所经过的每个元素。

只有当用户没有主动滚动时，我是否可以在悬停时启用功能触发器？

jQuery的内置.scroll()似乎不是我需要的，因为滚动事件仅在滚动开始时触发。我需要知道滚动是否“正在进行中”可以这么说。

---

更新：这是我目前的代码：

$container.find('div.item').each(function(i, e){
     $(e).hover(
          function(){
               $(this).toggleClass('expanded');
               // other functions here
          },
          function(){
               $(this).toggleClass('expanded');
          }
     );
});

所以，如果用户当前正在滚动页面，我想要禁用.hover()中的所有内容。

Answer 1

我会在setTimeout上使用mouseenter，然后在clearTimeout使用mouseleave，这会在悬停上产生小延迟，因此当用户将鼠标悬停在元素上达设定时间时，只会触发悬停。

这会希望最小化您的滚动问题。可能有比这更好的解决方案，但这是我想到的第一件事。

修改

快速写下这个例子，应该可以正常工作：

$(function() {
    "use strict";
    var $container = $("#container"),
        timeout, self;

    $container.find("div").each(function() {
        $(this).hover(
            function() {
                self = this;
                timeout = setTimeout(function() {
                    $(self).css({
                        width : 500,
                        height: 500
                    });
                }, 500);
            },
            function() {
                clearTimeout(timeout);
                $(this).css({
                    width : 300,
                    height: 300
                });
            }
        );
    });
});

对于演示，请转到这个小提琴：http://jsfiddle.net/sQVe/tVRwm/1/

这取决于你想要多少延迟，我用了500毫秒。

注意

不需要.each()，您可以立即致电.hover()收藏集上的div。我包括.each()，因为我不知道你是否想做更多只是绑定悬停事件。