js浏览器回到顶部方法_js回到顶部功能
js回到顶部功能
龙行 web前端 2019-1-2 2622 0评论
HTML代码
返回顶部
CSS代码
p#back-to-top{
position:fixed;
display:none;
bottom:100px;
right:80px;
}
js代码
$(function(){
//当滚动条的位置处于距顶部100像素以下时，跳转链接出现，否则消失
$(function () {
$(window).scroll(function(){
if ($(window).scrollTop()>100){
$("#back-to-top").fadeIn(1500);
}
else
{
$("#back-to-top").fadeOut(1500);
}
});
//当点击跳转链接后，回到页面顶部位置
$("#back-to-top").click(function(){
if ($('html').scrollTop()) {
$('html').animate({ scrollTop: 0 }, 100);//动画效果
return false;
}
$('body').animate({ scrollTop: 0 }, 100);
return false;
});
});
});
记得引入jquery
评论一下
赞助站长
赞助站长X
版权申明：此文如未标注转载均为本站原创，自由转载请表明出处《龙行博客》。
本文网址：https://www.liaotaoo.cn/141.html