我想知道是否有一种方法可以在用户向下滚动时更改导航的样式 - 这是示例代码
<div id="navigation">....</div>
<div id="about">....</div>
<div id="portfolio">....</div>
<div id="footer">....</div>
#navigation 是绝对的,因此始终位于页面顶部。我想知道是否只有当窗口在每个部分的开头滚动时才能显示导航。
所以一开始它是可见的,当用户开始滚动时它会淡出,当#about 部分可见时#navigation 会随着向下滚动而淡入和淡出。
我尝试通过这种方式获取#about、#portfolio 和#footer 的位置:
margin_top = $("#obsticalSC").css("margin-top");
然后有一个 if 语句,如果 #navigation 的上边距等于上面的,则显示它。但是上面的代码不起作用。
谢谢
最佳答案
由于您正在使用 jQuery,这可能会有所帮助:
这会获取元素的位置以及它滚动了多少。
很可能,我猜你正在做一个包含动态内容的页面(显示一个或另一个)。你可以做到
$("#about").scrollTop();
要获取关于 div 中向上滚动了多少,或者您可以将其更改为:
$("body").scrollTop();
如果您正在使用页面滚动条。你可以检查它向上滚动了多少,然后做你的淡入淡出的事情。
关于jquery - 如何使用 jquery 将元素的样式更改为滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7975912/