js : 怎么设置网页滚动条超过800px后,显示“返回顶部”的按钮?_百度知 ...

发布网友发布时间：2022-04-23 12:01

共3个回答

热心网友时间：2022-04-22 20:43

.dingbu2{display:none;}

引入 jquery.min.js 文件

$(window).on('scroll',function(){
    var st = $(document).scrollTop();
    if( st>0 ){
        $('.dingbu2').fadeIn(300);
    }else{
        $('.dingbu2').fadeOut(300);
    }
});
$(".dingbu2").click(function(){
    if(scroll=="off"){
        return;
    }
    $("html,body").animate({scrollTop: 0}, 600);
});

热心网友时间：2022-04-22 22:01

var dingbu2 = $('.dingbu2');
if($(window).scrollTop()>=800){
dingbu2.css('display','block'):
}
这样就可以了。追问嗯，谢谢，你的js很简短，不过你忘了：
当高度不够的时候，设置div 隐藏。
还是谢谢你！︿(￣︶￣)︿

热心网友时间：2022-04-22 23:36

#top{ position: fixed; width: 40px; height: 40px; right: 10px; top: 85%; background-image: url(../images/top.png); background-size: 80px 60px; background-position: 50% 10%; background-repeat: no-repeat; text-align: center; line-height: 60px; cursor:pointer }

<div id="top">TOP</div>

<script type="text/javascript" src=" jquery.min.js"></script>

$(function() {
$("#top").hide();
$(window).scroll(function() {
if ($(this).scrollTop() > 1){
$("#top").fadeIn();
} else {
$("#top").fadeOut();
}
});
$("#top").click(function() {
$("html,body").animate({
scrollTop: 0
}, 1000);
return false;
});
})

全部栏目

js : 怎么设置网页滚动条超过800px后,显示“返回顶部”的按钮?_百度知 ...