javascript - js怎么判断滚动条是否停止滚动？

Question

js怎么判断滚动条是否停止滚动？

Answer 1

滚动距离不变就没滚动

var topValue = 0,// 上次滚动条到顶部的距离  
        interval = null;// 定时器  
    document.onscroll = function() {  
        if(interval == null)// 未发起时，启动定时器，1秒1执行  
            interval = setInterval("test()", 1000);  
        topValue = document.documentElement.scrollTop;  
    }  
  
    function test() {  
        // 判断此刻到顶部的距离是否和1秒前的距离相等  
        if(document.documentElement.scrollTop == topValue) {  
            alert("scroll bar is stopping!");  
            clearInterval(interval);  
            interval = null;  
        }  
    }  

Answer 2

document.documentElement.scrollTop 很容易取不到值，修改了一下改用body取

interval = null;// 定时器  
document.onscroll = function() {  
    if(interval == null) {
      interval = setInterval("test()", 1000); 
    }  
}  

function test() {  
    // 判断此刻到顶部的距离是否和1秒前的距离相等  
    if(document.body.scrollTop == topValue) {   
        clearInterval(interval)
        interval = null
    } else {
      topValue = document.body.scrollTop 
    }
}  `

这样就没有问题了，这一次定时器的对比对象是上一次定时器执行时候添加进去的值，不会出现误差情况，唯一缺点就是间隔会比较长