这篇文章主要介绍了使用javascript实现博客园页面右下角返回顶部按钮的思路及源码,非常不错,这里推荐给小伙伴们
炫酷的返回顶部功能
js核心代码
window.onscroll = function(){ var t = document.documentElement.scrollTop || document.body.scrollTop; var top_div = document.getElementById( "go" ); if( t >= 300 ) { top_div.style.display = "block"; } else { top_div.style.display = "none"; } } var ptt=20; function pageScroll() { document.getElementById('flypig').style.display='block'; window.scrollBy(0,-10); //每次上升10px if(document.body.scrollTop==0) { document.getElementById('flypig').style.marginBottom=ptt+'px'; ptt=ptt+10; } scrolldelay = setTimeout('pageScroll()',2); //2毫秒重复执行一次 if(ptt>=1000){ ptt=0; document.getElementById('flypig').style.marginBottom=20+'px'; document.getElementById('flypig').style.display='none'; clearTimeout(scrolldelay); } //pageScroll ends } html
返回顶部按钮的实现 请往下滑
以上所述就是本文的全部内容了，希望大家能够喜欢。
以上就是javascript中返回顶部按钮的实现的详细内容，更多请关注0133技术站其它相关文章！
