如何让导航栏在滚动到页面上的某个点后保持不变？我不希望它在滚动过去后立即粘住，而是在我到达页面上的另一个 div 时粘住。
最佳答案
试试这个:
window.onscroll = function() {
var scrollTop = (window.pageYOffset !== undefined) ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop;
if (scrollTop >= document.getElementById("d").offsetTop) {
document.getElementById("nav").style.position = "fixed";
document.getElementById("d").style.marginTop = "50px";
document.getElementById("nav").style.marginTop = "-50px";
} else {
document.getElementById("nav").style.position = "static";
document.getElementById("d").style.marginTop = "0px";
document.getElementById("nav").style.marginTop = "0px";
}
}nav {
width: 100%;
height: 50px;
background: red;
z-index: 100;
}
body {
margin: 0;
min-height: 1000px
}
#d {
position: relative;
top: 100px;
width: 100%;
height: 50px;
background: yellow;
}<body>
<nav id="nav"></nav>
<div id="d"></div>
</body>当您滚动到黄色 div 时，红色导航栏会粘在视口(viewport)顶部并保持在那里，直到您向上滚动
关于HTML——如何让导航栏在滚动到页面上的某个点后保持不变？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26512061/