我的网站有一个响应式侧边栏。当屏幕顶部到达元素负 10 像素时,它应该开始它的 css 从“静态”更改为“固定”。它在我的笔记本电脑屏幕上对我来说没问题,但是当我将窗口大小调整为更像平板电脑的分辨率时,它不会从它应该开始的地方开始。您可以在此处查看结果。
我的代码如下:
var obj = $('#menu');
var offset = obj.offset();
var topOffset = offset.top;
var leftOffset = offset.left;
var marginTop = obj.css("marginTop");
var marginLeft = obj.css("marginLeft");
$(window).scroll(function() {
var scrollTop = $(window).scrollTop();
var px = $("#menu").height();
if (scrollTop >= (topOffset + px)){
obj.css({
marginTop: 0,
top: 20,
position: 'fixed',
});
} else
if (scrollTop < topOffset + px){ obj.css({ marginTop: marginTop, marginLeft: marginLeft, position: 'static', }); }
});