我正在使用此代码将div固定在顶部。它工作正常,但是在固定滚动时会增加div的宽度。
function moveScroller() {
var $anchor = $("#scroller-anchor");
var $scroller = $('#scroller');
var move = function() {
var st = $(window).scrollTop();
var ot = $anchor.offset().top;
if(st > ot) {
$scroller.css({
position: "fixed",
top: "0px"
});
} else {
$scroller.css({
position: "relative",
top: ""
});
}
};
$(window).scroll(move);
move();
};
$(function() {
moveScroller();
});
最佳答案
我想这就是你要达到的目标。
如您所见,我已将positions
元素的header
设置为fixed
。并将其定位到顶部。滚动时,它停留在页面顶部。
header {
width: 100%;
height: 100px;
background-color: red;
position: fixed;
top: 0px;
left: 0px;
}
.content {
background-color:black;
width: 100%;
height: 3000px;
color:white;
margin-top: 100px;
}
<header>My Header</header>
<div class="content">My Content</div>