jquery - 页面向下滚动时更改 .active 的导航栏链接

Question

我的页面顶部有一个固定的导航栏。我已经有了 jQuery，它在单击导航栏的链接并滚动到正确区域时删除和添加 .active 类。我似乎找不到的是，当页面向下滚动时，我如何获得相同的效果(替换 .active 类)？

Answer 1

Javascript 中的滚动事件

谢天谢地，这并不难。您可以使用 scroll event在 javascript 中检测页面何时被滚动。

有意义地使用滚动事件

现在是棘手的部分。您需要进行某种检测以查看您在页面的哪个部分，然后决定将类添加到哪些链接(作为一般规则，每次您点击这些点之一时，您应该从链接放在首位)。

值得庆幸的是，因为这似乎是一个垂直滚动，您应该能够沿着检测页面的百分比来决定您已经下降了多少百分比。然后，当您针对谓词达到这些阈值时，您可以在那里执行您的逻辑。