首页 > 代码库 > js监听滚动条 回到顶端

js监听滚动条 回到顶端

效果:当出现滚动条,且滚动条出现移动时,把回到顶端按钮 显示出来;当滚动条回到顶部时,将回到顶端按钮隐藏。

    <script type="text/javascript">     //获取滚动条的位置        function getScrollTop() {            var scrollPos;            if (window.pageYOffset)            {                scrollPos = window.pageYOffset;            }            else if (document.compatMode && document.compatMode != ‘BackCompat‘)            {                scrollPos = document.documentElement.scrollTop;            }            else if (document.body)            {                scrollPos = document.body.scrollTop;            }            return scrollPos;        }        window.onscroll = function () {//监听滚动条            if (getScrollTop() > 20) {//当滚动条离开顶端时,显示"回到顶部"。这里写20的原因是,"回到顶端"按钮也不是需要马上出现,根据自己的需求 而设置。                $("#top_div").show();            }            else {//当滚动条回到顶端时,将"回到顶端按钮"  隐藏                $("#top_div").hide();            }        }    </script><style type="text/css"> #top_div{     position:fixed;     bottom:280px;     left:0;     display:none; } </style> 

小记。。。

 

js监听滚动条 回到顶端