Làm cách nào để phát hiện khi người dùng đang di chuyển tích cực?

Question

Trang của tôi có vùng có thể cuộn chứa một số thành phần. Mỗi phần tử kích hoạt một hàm khi di chuột qua.

Vấn đề của tôi là nếu người dùng cuộn lên hoặc xuống bằng con lăn chuột của họ, hàm sẽ kích hoạt mọi phần tử con trỏ đi qua khi vùng cuộn xuống bên dưới.

Có cách nào để tôi có thể kích hoạt chức năng khi di chuột chỉ khi người dùng không chủ động cuộn không?

jQuery được xây dựng trong .scroll() dường như không phải là những gì tôi cần, vì sự kiện cuộn chỉ được kích hoạt khi cuộn bắt đầu. Tôi cần biết liệu cuộn giấy có đang được tiến hành hay không.

---

UPDATE: Đây là mã hiện tại của tôi:

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

Vì vậy, những gì tôi muốn làm là vô hiệu hóa tất cả mọi thứ trong .hover() nếu người dùng đang di chuyển trang.

Answer 1

tôi sẽ sử dụng setTimeout với một thời gian hợp lý trên mouseenter và sau đó clearTimeout trên mouseleave, mà sẽ tạo ra một sự chậm trễ nhỏ trên dềnh, do đó di chuột sẽ chỉ kích hoạt khi người dùng giữ chuột của mình qua phần tử cho cài đặt thời gian.

Điều này sẽ hy vọng giảm thiểu sự cố cuộn của bạn. Có thể có một giải pháp tốt hơn thế này, nhưng đó là điều đầu tiên tôi nghĩ đến.

EDIT

Wrote ví dụ này một cách nhanh chóng, nên hoạt động tốt:

$(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 
       }); 
      } 
     ); 
    }); 
}); 

Đối với một bản demo đi thay vì chỉ violong này: http://jsfiddle.net/sQVe/tVRwm/1/

Đó là tùy thuộc vào bạn có bao nhiêu một sự chậm trễ bạn muốn, tôi sử dụng 500ms.

LƯU Ý

Các .each() là không cần thiết, bạn có thể gọi .hover() vào bộ sưu tập div ngay lập tức. Tôi đã bao gồm .each() vì tôi không biết bạn có muốn làm nhiều hơn là chỉ ràng buộc sự kiện di chuột hay không.