我使用 jQuery Waypoints 插件创建了一个粘性导航,但我无法让导航选项在选择某个部分时始终突出显示。
在我的示例中,您将看到菜单项仅在该部分位于范围内时才处于“事件”状态,并且这会根据视口(viewport)的高度而变化,这是 Waypoints 默认情况下的工作方式:
http://jsfiddle.net/keith/v6vuN/2/ (或全屏版本:http://jsfiddle.net/keith/v6vuN/2/embedded/result/)
我希望菜单项始终突出显示,即使该部分不在范围内。
例如,如果我位于“精选”部分并且“联系人”可见,即使浏览器窗口的高度无法滚动到整个部分,我仍然希望菜单选项突出显示。
这有道理吗?我不想只是在各部分之间或页面底部添加大量填充/边距以使其更长。
最佳答案
在这部分,更改:
// 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% 应该可以。
关于jquery - 使用 jQuery Waypoints 插件的粘性导航栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5667634/