如何通过鼠标在JavaScript中以编程方式滚动来区分滚动？

我通过在Javascript改变scrollLeft属性滚动的溢出DIV的内容：如何通过鼠标在JavaScript中以编程方式滚动来区分滚动？

setInterval(function(){ 
    $('#scrollbox').scrollLeft($('#scrollbox').scrollLeft()+1); 
}, 50);

不过，我想尽快制止这种当用户滚动内容本身，使用鼠标。我试图使用滚动事件来检测此事

$('#scrollbox').scroll(function(){...});

但是，我上面的自动滚动也触发该事件。我如何区分这一点，并仅对用户启动的滚动做出反应？（或：我怎么能烧制而成滚动事件停止上述代码也将做的伎俩？）

来源

2011-08-24 travelboy

您可以检查用户鼠标是否在滚动的div上，因为大多数浏览器只在用户点击div时才滚动div。尽管如此，这并不是完全可以证明的，因为当他徘徊在div上时，你的事件可能会触发。 –

由于DIV填充了整个客户区域，因此不实用。此外，Mac用户用两个手指滚动（不点击）。 – travelboy

您可以使用.hover()：功能停止滚动，当鼠标在滚动框元素：

http://jsfiddle.net/bGHAH/1/

setInterval(function(){ 
    if(!mouseover) 
    { 
     $('#scrollbox').scrollLeft($('#scrollbox').scrollLeft()+1); 
    } 
}, 50); 

var mouseover = false; 
$('#scrollbox').hover(function(){ 
    mouseover = true; 
},function(){ 
    mouseover = false;  
});

编辑

根据您的COM我设法从以下网站找到一个jquery插件：special scroll events for jquery。

此插件包含一个事件，它尝试根据上一个滚动步骤和检查完成之间所经过的时间段来确定滚动是否已停止。

为了得到这个工作，我需要减慢你的时间间隔，以使插件使用的延迟达到310毫秒。这样做意味着我必须增加滚动步骤才能使其明显移动。

这里是链接：

http://jsfiddle.net/EWACn/1/

这里是代码：

var stopAutoScroll = false; 

$(document).ready(function(){ 

setInterval(function(){ 
    if(!stopAutoScroll) 
    { 
     $('#status').html('scrolling'); 
     $('#scrollbox').scrollLeft($('#scrollbox').scrollLeft()+10); 
    }else{ 
     $('#status').html('not scrolling'); 
    } 
}, 310); 

$('#scrollbox').bind('scrollstart', function(e){ 
    stopAutoScroll = true; 
}); 

$('#scrollbox').bind('scrollstop', function(e){ 
    stopAutoScroll = false; 
}); 

});

希望这有助于。

来源

2011-08-24 16:43:21 jdavies

，由于DIV填满整个客户区，因此，老鼠是在它的大部分时间（无需滚动） – travelboy

最后我用一个变通办法（在滚动事件处理我保存的最后位置，并检查是否是不实际滚动距离为1px。如果是这样，我假设它是从编程滚动发生的，否则从鼠标发生）。但这绝对是一个很酷的方法，所以我会接受这个答案。非常感谢！ – travelboy

对于FF（Mozilla的）：

document.addEventListener('DOMMouseScroll', handler, false);

对于IE，歌剧和铬：

document.onmousewheel = handler;

来源

2011-08-24 16:46:02 ZenMaster

另一个选择是具有可以先于设置外部标记编程滚动，然后重置后缀。如果滚动事件被触发并且该标志未设置，则您知道用户有责任并可以采取相应的行动。

不幸的是，虽然这是独立于浏览器并易于阅读，但它可能会导致您相信某些用户卷轴是程序化卷轴。不过，我认为这种情况很少发生，可能值得你根据你正在编写的应用程序。

来源

2011-08-24 16:49:22 Rontologist

尝试wheel event，对于大多数现代浏览器

当指向设备（通常为小鼠）的滚轮按钮旋转轮事件被触发。

来源

2017-04-12 14:14:51

如何通过鼠标在JavaScript中以编程方式滚动来区分滚动？

回答

相关问题