'active' 导航项取决于特定部分

Question

我正在使用插件Scrollify 来登陆，一切都很好，但我无法解决一个问题。我有 8 个部分，其中有一个不同的 "data-section-name" 属性。 我还有导航，它看起来像带有 'active' class 的圆圈。我写了函数，所以现在当我点击任何圆圈时，它会变成 'active' 并滚动到某个部分。但是当我使用鼠标滚动时，圆圈的 'active' 不会改变。我应该怎么办？我怎样才能识别部分并做 'active' 特定的圈子？

Answer 1

您可以在 before() 或 after() 您的 scrollify() 属性 上使用 $.scrollify.current() 方法获取活动部分的数据。通过匹配您的数据，您可以将 active class 添加到您的导航中。

在下面找到 fiddler 供您参考。

这里我在左侧使用了固定导航来指示滚动导航（不捕获点击事件）。希望对你有帮助。