无法使 Scrollspy Bootstrap 工作答案

【问题标题】：Cannot make Scrollspy Bootstrap work无法使 Scrollspy Bootstrap 工作
【发布时间】：2012-09-13 01:47:46
【问题描述】：

我正在设计一个单页网站，并且希望固定导航链接在用户滚动到指定位置时改变颜色。看起来很容易做到，我认为这很容易做到，但我在让它工作时遇到了问题。

我只下载了 Scrollspy JS 插件，因为我没有使用 Twitter Bootstrap CSS。我只需要 Scrollspy 插件。

你能检查一下这个 jsFiddle 并提供一些指导吗？我已经查看了文档here，但我没有运气。非常感谢任何帮助:)

【问题讨论】：

【解决方案1】：

忽略您使用 JSFiddle 的严重问题¹，以及排版错误²，原则问题是

这是一个固定的演示：

JSFiddle

哦，你不需要同时使用 data-api 和 js 来初始化插件；选择一个。

_{1 同时加载Bootstrap 2.0.2 + 2.0.4；试图在 html 面板中包含<body>}

_{2 在不需要的函数上使用 upperCamelCase：scrollSpy();}

【讨论】：

谢谢！并感谢您指出我的弱点。最好的学习方式:)。这是我第一次使用 jsFiddle。但我会得到它的窍门。
请在滚动条介于两者之间时调整浏览器大小，然后检查菜单栏中的选定项目...它不适用于浏览器调整大小:(
@ChinmayeeG 我看不出处理视口更改与解决 OP 问题有何关系。处理您的评论将涉及扩展 ScrollSpy 插件的功能，我认为这不在问题的范围内。但是，我承认您指出的问题，并鼓励您将其作为单独的问题发布到其他地方。

【解决方案2】：

您缺少的关键是您必须在 ul 元素（或其他一些父元素）上有一个“导航”类，因为它在 scrollspy 代码中用作选择器的一部分。

由于某种原因，我无法让您使用，但这里有一个简化的示例： http://jsfiddle.net/UWzeD/5/

【讨论】：

【解决方案3】：

你的 ul 需要一个 nav 类，但要让 scrollspy 正常工作，最重要的是你的目标必须是 ul 的一个级别。否则我发现 scrollspy 不起作用。

【讨论】：