Question

当我位于页面顶部时，我需要隐藏jQuery中的“Go-to Top”div按钮。当我在页面顶部时，按钮出现当滚动条到达顶部时我需要隐藏按钮，当我开始向下滚动页面时显示它。

这是我的代码，

$(function() {
    var $elem = $('#content');

    $('#nav_up').fadeIn('slow');
    $('#nav_down').fadeIn('slow');  

    $(window).bind('scrollstart', function(){
    $('#nav_up,#nav_down').stop().animate({'opacity':'0.2'});
    });
    $(window).bind('scrollstop', function(){
        $('#nav_up,#nav_down').stop().animate({'opacity':'1'});
    });

    $('#nav_down').click(
        function (e) {
            $('html, body').animate({scrollDown: $elem.height()}, 800);
        }
    );
    $('#nav_up').click(
        function (e) {
            $('html, body').animate({scrollTop: '0px'}, 800);
        }
    );
});

Answer 1

只需添加一个窗口scroll（）方法：

$(window).scroll(function() {
    if ($(this).scrollTop() > 100) {
        $('#nav_up').fadeIn();
    } else {
        $('#nav_up').fadeOut();
    }
});

Answer 2

if($(window).scrollTop() == 0){
    //code to hide your element
}

jquery隐藏滚动到页面顶部div

2 个答案: