首页 / 脚本样式 / JavaScript / javascript返回顶部的按钮实现方法

<a href="javascript:;" id="btn" title="回到顶部"></a>

#btn{position:fixed;display:none;}

window.onload = function（）{var obtn = document.getElementById（"btn"）;//获取页面可视区的高度var clientHeight = document.documentElement.clientHeight;var timer = null;var isTop = true;window.onscroll = function（）{var osTop = document.documentElement.scrollTop || document.body.scrollTop;if （osTop >= clientHeight）{//显示按钮obtn.style.display = "block";}else {//隐藏按钮obtn.style.display = "none";}if （！isTop）{clearInterval（timer）;}isTop = false;};obtn.onclick = function（）{//设置定时器timer = setInterval（function（）{//获取滚动条距离顶部的高度var osTop = document.documentElement.scrollTop || document.body.scrollTop;var ispeed = Math.floor（-osTop / 6）;document.documentElement.scrollTop = document.body.scrollTop = osTop +ispeed;isTop = true;if （osTop === 0）{clearInterval（timer）;}},30）;};};