[英]div position fixed on the scroll, start before the top of the page
当“侧边栏”到达“固定标题”而不是页面顶部时,如何将其“固定”定位?
$(function() {
var top = $('#sidebar').offset().top - parseFloat($('#sidebar').css('marginTop').replace(/auto/, 0));
var footTop = $('#footer').offset().top - parseFloat($('#footer').css('marginTop').replace(/auto/, 0));
var maxY = footTop - $('#sidebar').outerHeight();
$(window).scroll(function(evt) {
var y = $(this).scrollTop();
if (y > top) {
if (y < maxY) {
$('#sidebar').addClass('fixed').removeAttr('style');
} else {
$('#sidebar').removeClass('fixed').css({
position: 'absolute',
top: (maxY - top) + 'px'
});
}
} else {
$('#sidebar').removeClass('fixed');
}
});
});
这一行:
if (y > top) {
假设您的固定标头没有填充(否则您也必须考虑到这一点),您可以更改为此
if (y >= top - $('#fixedHeader').height()) {
删除top:0px;
从你的侧边栏css,并为你的固定标题添加预期的高度(目前你给它的高度为40px),所以
#sidebar.fixed {
position: fixed;
top: 40px;
}
我还从#fixedHeader
删除了填充,因为你没有指定它是什么/如果你想要的话。 如果您确实需要填充,如上所述,您还必须将其添加到计算中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.