如何檢測用戶何時主動滾動？

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() ，您可以立即在div集合上調用.hover() 。 我包含了.each()是因為我不知道你是否想要做的不僅僅是綁定懸停事件。