js判断用户是否正在滚动滚动条，滚动条滚动是否停止

js智能判断是否可以自动滚动

比如，做一个音乐播放器，边播放，边定位歌词，播放的时候，需要自动定位到播放语句，但是用户去拖动或者滚动div(歌词面板)时，这时就必须停止自动滚动，或者说是不能自动滚动，这个怎么做呢？ 如果能时时判断 用户是否在滚动就好了？ 或者能够 知道滚动开始 和 结束事件 也行？ 可惜均不知道！ 目前，仅可以利用的就是div元素的滚动事件，下面是我的实现思路，如何判断用户是否滚动停止？

1.html代码

<div id="panel">
   <div id="div1"></div>
   <div id="div2"></div>
   <a name="div3Anchor"> </a>
   <div id="div3"></div>
</div>

2.js代码

//默认，播放时可以自动定位播放语句
window.canAutoScroll = true;
//只要滚动事件发生，就停止自动滚动定位方法的执行
var timeout = null;
var panel = $("#panel");
panel.scroll(function(){
    if(timeout != null){
       window.clearTimeout(timeout);
    }
    window.canAutoScroll = false;
    //500ms后，假定认为停止滚动
    timeout = window.setTimeout(function(){
        window.canAutoScroll = true;
    },500);
});

//播放事件
var playEvent = function(time){
   //滚动到指定语句
   var autoScroll = function(){
        var panel = $("#panel");
var div3 = document.getElementById("div3");
        panel.animate({
              scrollTop: div3.offsetTop - panel.height() / 2
        }, 200);
    }
   if(window.canAutoScroll){
        autoScroll();
   }
}

 

转载于:https://www.cnblogs.com/hdwang/p/4875678.html