js 判断滚动条是否停止滚动

<!DOCTYPE html>  
<html>  
<head>  
<meta charset="utf-8">  
<title>js判断滚动条停止</title>  
<style type="text/css">
    .box {
        height: 3000px;
    }
</style>
<script type="text/javascript">  
    var topValue = 0, // 上次滚动条到顶部的距离
        interval = null; // 定时器
    document.onscroll = function() {
        if(interval == null) {
            // 未发起时,启动定时器,1秒1执行
            interval = setInterval(function() {
                if(document.documentElement.scrollTop == topValue) {
                    alert("scroll bar is stopping!");
                    clearInterval(interval);
                    interval = null;
                }
            }, 1000);
        }
        topValue = document.documentElement.scrollTop;
    }  
</script>  
</head>  
    <div class="box"></div>
<body>  
</body>  
</html> 

这个需求是我在写一个固钉的时候遇到的问题,当滚动条滚动时固钉隐藏,当停止滚动时固钉出现

posted on 2017-09-12 18:30  sjpqy  阅读(2310)  评论(0编辑  收藏  举报

导航