我在一个网站上有一个导航栏,目前可以使用这个jQuery代码正常工作,以使其在滚动过去时变得"粘稠":
offset = $('#navWrapper').offset();
$(window).scroll(function(){
if( $(window).scrollTop() >= offset.top ) {
$('#navWrapper').addClass('fixedNavWrapper');
$('#topHeader').addClass('fixedNavPadding');
} else {
$('#navWrapper').removeClass('fixedNavWrapper');
$('#topHeader').removeClass('fixedNavPadding');
}
});
要应用和删除此 CSS,请执行以下操作:
.fixedNavWrapper {
position:fixed;
top:0;
left:0;
z-index:999;
}
.fixedNavPadding {
padding-bottom:45px;
}
当我将"高度:100%"应用于 html 时,它停止工作。我需要 html 具有高度:100% 才能使用它的粘性页脚。我能做什么?
当您将html
高度设置为 100%
时,您不再滚动到窗口中,而是在html
内。因此,此代码将不起作用:
$(window).scroll();
$(window).scrollTop();
尝试将window
更改为 $('html,body')
。