好资源导航 » 文章资讯 » js实现返回顶部效果

js实现返回顶部效果

2024-02-27 21:11:03 43

话不多说，请看代码：





JS点击按钮到页面最底部/返回页面顶部代码

#back-to-top{position:fixed;bottom:50px;right:10%;}

返回顶部

$(document).ready(function(){ //首先将#back-to-top隐藏 $("#back-to-top").hide(); //当滚动条的位置处于距顶部100像素以下时，跳转链接出现，否则消失 $(function(){ $(window).scroll(function(){ if($(window).scrollTop()>100){ $("#back-to-top").fadeIn(100); } else { $("#back-to-top").fadeOut(100); } }); //当点击跳转链接后，回到页面顶部位置 $("#back-to-top").click(function(){ $('body,html').animate({scrollTop:0},"speed"); returnfalse; }); }); });

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持毛票票！

返回顶部
514930285
czq8825@qq.com

js实现返回顶部效果

热门推荐

随机推荐