使用jQuery检测每个实例的鼠标滚动，而不是每次点击

我试图做的是在用户向上或向下滚动时移动元素。 我在一个名为goTo（）的函数中有这个机制。 我也试图通过使用变量来跟踪用户的位置。 当用户向上或向下滚动时，变量上升或下降一。 这是我的function到目前为止的样子：

$(window).on('DOMMouseScroll mousewheel', function(event){ clearTimeout($.data(this, 'timer')); // NEW CODE $.data(this, 'timer', setTimeout(function() { // NEW CODE if( event.originalEvent.wheelDelta > 0 || event.originalEvent.detail < 0 ) { --curScl; goTo(curScl); } else { ++curScl; goTo(curScl); } }, 250)); // NEW CODE }); 

更新：根据@Bart Jedrocha的建议，我添加了一个setTimeout包装器，它使curSel的值curSel随每个滚动而暴涨。 但是，在执行滚动和元素移动之间存在延迟。 感觉非常不自然。 有没有办法在没有延误的情况下做到这一点？

Answer 1

尽管setTimeout在技​​术上有效，但在用户滚动鼠标和页面滚动之间会有一点延迟。 这感觉不自然并且变得烦人。 因此，我需要另一种解决方案。

 var scl=0; // Create a variable window.setInterval(function(){ scl=0; // Reset this variable every 1.5 seconds }, 1500); $(window).on('DOMMouseScroll mousewheel', function (e) { // Detect movement on the scrollwheel anywhere in browser window if(e.originalEvent.detail > 0 || e.originalEvent.wheelDelta < 0) { while(scl==0) { // Create a while loop that only executes while your variable equals 0 // CODE HERE scl++; // Make your variable equal 1 after executing once } } else { while(scl==0) { // Same deal, but this time while the user scrolls down // CODE HERE scl++; } } }); 

这似乎没有问题。 如果有人看到可以清理一下的地方，请告诉我。 谢谢！

Answer 2

如果我理解正确，你会在滚动事件停止时尝试递增/递减1。 不幸的是，没有可以绑定的scrollStop事件。 您可以在事件处理程序中使用setTimeout来防止变量在滚轮的每个刻度上增加。 看一下这个例子吧。

Answer 3

您始终可以检查自上次调用事件以来经过的系统时间。

 var c_time = 0; $(window).on('DOMMouseScroll mousewheel', function(event){ if(($.now() - c_time) > 500) //0.5s { c_time = $.now(); //Do smthng there... } });