[英]Return Navbar to Original Position After Scrolling
我已设置此页面,以便当您滚动到导航栏的顶部时,它会变得粘滞并停留在页面顶部。
当您滚动回到页面顶部时,我希望它返回到其原始位置。
这是我目前拥有的工作的CodePen 。 我应该如何更改jQuery,使其重新回到原来的位置?
$(window).on('scroll', function () {
var $header = $("#header"),
scrollTop = $(window).scrollTop(),
elementOffset = $header.offset().top,
distance = (elementOffset - scrollTop);
if (distance < 0) {
$header.css({
"position": "fixed",
"top": "0px",
"left": "0",
"right": "0"
});
}
});
现在,这就是当用户向下滚动页面时将标题元素更改为固定元素的方式。
用另一种方式考虑解决方案:
的CSS
.affix {
position:fixed;
top:0;
left:0;
right:0;
}
JS
if (distance < 0) {
$header.addClass("affix");
} else {
$header.removeClass("affix");
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.