回到顶部bug
参考自一博客(https://www.cnblogs.com/abao0/p/6642288.html)内有慕课网教程(后发现有bug, 弃置不用了)
以下有问题, 当滚动条处于顶部时, 刷新页面, 回到顶部icon依然会出现.
//Page loading trigger window.onload = function () { var oscrollBtn = document.getElementById('scrollBtn'); var timer = null; var isTop = true; //Gets the height of the visible window var clientHeight = document.documentElement.clientHeight;//Triggered when the scroll bar rolls window.onscroll = function () { var osTop = document.documentElement.scrollTop || document.body.scrollTop; if (osTop >= clientHeight) { oscrollBtn.style.display = 'block'; } else { oscrollBtn.style.display = 'none'; } if (!isTop) { clearInterval(timer); } isTop = false; } oscrollBtn.onclick = function () { //Set timer timer = setInterval(function () { //Gets the height of the scroll bar var osTop = document.documentElement.scrollTop || document.body.scrollTop; //The scroll bar slows down var ispeed = Math.ceil(osTop / 6); document.documentElement.scrollTop = document.body.scrollTop = osTop - ispeed; isTop = true; if (osTop == 0) { clearInterval(timer); } }, 30); } }
作者:习惯沉淀
如果文中有误或对本文有不同的见解,欢迎在评论区留言。
如果觉得文章对你有帮助,请点击文章右下角【推荐】一下。您的鼓励是博主的最大动力!
扫码关注一线码农的学习见闻与思考。
回复"大数据","微服务","架构师","面试总结",获取更多学习资源!