JS 回到顶端 back to top
Posted 笑逗逗
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS 回到顶端 back to top相关的知识,希望对你有一定的参考价值。
CSS: .backtoTop2{ height: 40px; width: 50px; position: fixed; padding-top: 8px; right: 100px; z-index: 9999; background: red; cursor: pointer; text-align: center; } JS: $(document).ready(function(){ $(window).scroll( function() { // change scroll event var height = $(window).height(), //get window height top = $(document).scrollTop(); //get scroll top if(top > height ){ //more than height to show $("#backToTop2").fadeIn(300).css({ top: height-80 }); } if(top < height ){ //less than height to disappear $("#backToTop2").fadeOut(200); } }); /*back to top click*/ $(‘#backToTop2‘).click(function(){ $(‘html, body‘).animate({ // Animation effects --> move scrollTop: 0 }, 500); }); }); HTML: <divid="backToTop2"class="backtoTop2"></div>
以上是关于JS 回到顶端 back to top的主要内容,如果未能解决你的问题,请参考以下文章
点击网页底部的top按钮直接回到网页顶部,怎么做?用js怎么表达
如何从 Material UI 为我的应用中的 React 添加带有 Back to Top 按钮的 AppBar?