Question

我知道这是一个非常常见的问题，但我花了大约两天的时间爬上论坛，尝试修复，似乎无法找到答案。

我有一个使用一些视差滚动的标准引导程序设置。我有一个导航栏固定在页面底部。每个<li>形状像一个圆圈，<li>内部是<a>标签。每个＆＃39;循环＆＃39; <li>链接到页面上的锚标记，以便在页面周围提供导航。这是一个单页模板设置。

这是一个小提琴： https://jsfiddle.net/k8g3qydw/1/

我正确地将bootstrap.css和.js文件排入队列，我添加了data-target=".scrollspy" data-spy="scroll" data-offset="0" 到body标记，并将类.scrollspy添加到<ul>的父元素中，如下所示：

<div class="scrollspy board-inner">
    <ul class="nav nav-tabs" id="myTab">
        <div class="liner"></div>
            <li class="nav-item active">

所以，我很困惑该做什么！

非常感谢任何帮助！

Answer 1

您的代码中存在多个错误。

您应该使用一种方法将Bootstrap ScrollSpy添加到您的页面，而不是两者：通过数据属性或 JavaScript。所以你应该删除你的身体属性或javasript行$('body').scrollSpy({...});
ID属性必须是整个文档的唯一属性。您在页面上有重复的ID。并且..在错误的地方。关于工作小提琴#spy被分配给导航包装器，因为它是被窥探的那个。
Navbar链接应指向＆＃34; resolvable id targets＆＃34;而不是<a name="service">。您应该使用<a id="service">。
并确保在您的文档bootstrap.min.js之后包含jQuery。因为Bootstrap需要jQuery，而不是其他方式。

这是一个有效的JSFiddle

我无法使用scrollspy来使用我的bootstrap导航栏

1 个答案: