当我在页面顶部时,我需要隐藏jQuery中的"转到顶部"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);
}
);
});
只需添加一个窗口 scroll() 方法:
$(window).scroll(function() {
if ($(this).scrollTop() > 100) {
$('#nav_up').fadeIn();
} else {
$('#nav_up').fadeOut();
}
});
if($(window).scrollTop() == 0){
//code to hide your element
}