javascript - js怎么判断滚动条是否停止滚动?
高洛峰
高洛峰 2017-04-11 11:29:25
0
2
265

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

高洛峰
高洛峰

拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。 网络人气名人讲师,...

reply all(2)
Ty80

滚动距离不变就没滚动

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;  
        }  
    }  
刘奇

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 
    }
}  `

这样就没有问题了,这一次定时器的对比对象是上一次定时器执行时候添加进去的值,不会出现误差情况,唯一缺点就是间隔会比较长
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!