Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/460.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用鼠标拖动滚动条时不会触发Mousemove事件_Javascript_Jquery_Html_Css - Fatal编程技术网

Javascript 使用鼠标拖动滚动条时不会触发Mousemove事件

Javascript 使用鼠标拖动滚动条时不会触发Mousemove事件,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我需要检测鼠标在我的网站滚动条上的移动,这允许我检测用户的不活动 拖动滚动条时,不会触发鼠标移动事件 在IE11和Chrome中不工作,我看到mousemove事件在Firefox32中启动,我还没有测试过其他浏览器 示例代码: HTML JS小提琴: 绑定到滚动事件是我目前拥有的解决方案,但我想知道是否有更干净的解决方案,因为我需要绑定到100多个不需要滚动事件的div,因为这看起来真的很冗余、肮脏,而且我通常不喜欢在代码中使用这样的破解 干杯;) 我猜不会引发鼠标事件,因为滚动条在技术上不

我需要检测鼠标在我的网站滚动条上的移动,这允许我检测用户的不活动

拖动滚动条时,不会触发鼠标移动事件


在IE11和Chrome中不工作,我看到mousemove事件在Firefox32中启动,我还没有测试过其他浏览器

示例代码:

HTML

JS小提琴:

绑定到滚动事件是我目前拥有的解决方案,但我想知道是否有更干净的解决方案,因为我需要绑定到100多个不需要滚动事件的div,因为这看起来真的很冗余、肮脏,而且我通常不喜欢在代码中使用这样的破解


干杯;)

我猜不会引发鼠标事件,因为滚动条在技术上不在页面范围内

相反,您可以收听
onscroll
事件吗


只有在屏幕内移动鼠标时才会触发鼠标移动事件。
这里的问题是滚动条不是捕获鼠标移动事件的屏幕内侧,因此您应该添加具有相同功能的滚动事件

我看不出有任何理由不能在滚动条开始自动移动时从滚动条中删除
onscroll
处理程序,并在自动移动停止时重新应用onscroll处理程序。无法激发未附加的事件。。因此,事件触发处理程序的唯一时间是用户启动滚动时。是的,您只能在客户端区域中找到鼠标事件。滚动条不是窗口客户端区域的一部分。我看到Firefox 32中触发了mousemove事件,如果这不能帮助您处理所有需要针对的浏览器,您最好忘记这些琐事,专注于一种适用于所有目标环境的方法。不幸的是,这是使用web时的野兽本性(@Xela我不认为在现代,这会造成如此巨大的性能问题只是一个滚动事件是的,我的意思是它有点多余的绑定鼠标将事件移动到不需要它们的溢出元素。我喜欢让我的代码看起来漂亮,对任何需要维护它的人来说不那么混乱。@Xela如果要谈论性能,我首先建议为了摆脱jquery,有许多jquery替代方案都有更简单的纯js函数,您可以使用它们,而无需使用jquerys变量填充ram。我不在乎性能,只要有好的代码,不需要做简单的函数。我喜欢让我的代码成为一门艺术,在每个不需要的可滚动div中都有冗余的滚动事件需要它们似乎真的很肮脏。@Xela我喜欢的完全相反:)凌乱和太空船一样的代码我喜欢:D
<div class="parent" style="background-color:black;width:100px;height:500px;overflow:scroll;">
    <div class="child" style="background-color:blue;width:100px;height:1000px"></div>
</div>
var lastMove;
$(window).mousemove(function (e) {
    lastMove = new Date();
     $(".child").css("background-color", "red");

    lastTimeMouseMoved = new Date().getTime();
       var t=setTimeout(function(){
           var currentTime = new Date().getTime();
           if(currentTime - lastTimeMouseMoved > 10){
               $(".child").css("background-color", "blue");
           }
       },10);
 });