使用 jQuery Waypoints 插件的粘性导航栏答案

【问题标题】：Sticky Nav Bar Using jQuery Waypoints Plugin使用 jQuery Waypoints 插件的粘性导航栏
【发布时间】：2011-04-14 18:11:07
【问题描述】：

我使用 jQuery Waypoints 插件创建了一个粘性导航，但我无法让导航选项在选择某个部分时始终突出显示。

在我的示例中，您将看到菜单项仅在该部分在范围内时“活动”，并且这会根据视口的高度而变化，这是默认情况下 Waypoints 应该工作的方式：

我希望菜单项始终突出显示，即使该部分不在范围内。

例如，如果我在“精选”部分并且“联系人”可见，即使浏览器窗口的高度无法滚动到整个部分，我仍然希望突出显示菜单选项。

这有意义吗？我宁愿不只是在部分之间或页面底部添加大量填充/边距以使其更长。

【问题讨论】：

【解决方案1】：

在这部分，改变：

// Register each section as a waypoint.
$('#main > .section').waypoint({ offset: '0'});

收件人：

// Register each section as a waypoint.
$('#main > .section').waypoint({ offset: '50%'});

0 偏移距屏幕顶部 0 像素，而 50% 将使其在中点触发。相应地调整，但 50% 应该这样做。

【讨论】：