当页面下拉一定距离的时候出现一个图标点击图标回到页面顶部
html代码 <section class="footer-popup"> <a class="side_btn top" id="back-to-top" href="javascript:;" title="返回顶部" style="display: none; width: 45px; height: 45px; background:url(/home/default/images/top_bg.png) no-repeat -1px -47px;"> </a> </section>
js代码 <script> $(window).scroll(function () { //获取滚动条距离顶部高度 var scrollTop = $(window).scrollTop(); //滚动条距离顶部高度为300的时候出现图标 scrollTop > 300 ? $("#back-to-top").fadeIn(200).css("display","block") : $("#back-to-top").fadeOut(200); }); //返回顶部 $('#back-to-top').click(function (e) { $('html,body').animate({ scrollTop:0}); }); </script>
本文由:xiaoshu168 作者:xiaoshu发表,转载请注明来源!