2

我正在尝试使用带有 Scrollspy 的 Bootstrap 3 RC1 创建一个站点。我的网页现在非常简单，基本上是这样设置的：

<html>
    <head>
        <!-- Head stuff here -->
    </head>

    <body>
        <section id="section_1" data-spy="scroll">
            <!-- stuff in here -->
        </section>
        <section id="section_2" data-spy="scroll">
            <!-- stuff in here -->
        </section>
        <section id="section_3" data-spy="scroll">
            <!-- stuff in here -->
        </section>

        <JScripts here ... />
    </body>
</html>

我通过调用初始化了 Scrollspy，$("section").scrollspy()并设置了一个事件处理程序，如下所示：

$("section").on("activate", function(e) {
    // do stuff
});

我的问题是这个activate事件永远不会被触发。有谁知道为什么它不工作？我注意到所有教程都使用导航栏来突出显示当前部分，但我真的不想要导航栏。

4

1 回答 1

5

您对 scrollspy 的标记有点偏离。Scrollspy 可能不会触发，这就是您可能没有得到任何结果的原因。以我的经验，用户数据属性启动滚动监视要容易得多。如果您将滚动侦听器附加到正文本身以外的任何其他元素，我还没有阅读过一份报告。

您应该像这样将它们应用于您的身体标签。

<body data-spy="scroll" data-target="#YOUR NAV CONTAINER">

此外，您需要确保您的导航结构是这样的：

<div id="YOUR NAV CONTAINER">
     <ul class="nav">
          <li><a href="#SECTIONID">list item</a></li>
          <li><a href="#SECTIONID">list item2</a></li>
     </ul>
</div>
于 2013-08-15T17:55:09.540 回答