我無法使用scrollspy與我的bootstrap導航欄一起工作

我知道這是一個非常普遍的問題，但我花了兩天時間爬過論壇，嘗試修復，似乎無法找到答案。我無法使用scrollspy與我的bootstrap導航欄一起工作

我有一個標準的自舉設置，使用一些視差滾動。我有一個固定在頁面底部的導航欄。每個<li>形狀都像一個圓圈，在<li>內部是一個<a>標籤。每個「圓形」<li>鏈接到頁面上的錨定標記以提供頁面周圍的導航。這是一個設置了一頁的模板。

我有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">

所以，我很困惑，該怎麼做！

任何幫助非常感謝！

代碼中有多處錯誤。

你應該使用一種方法來引導ScrollSpy添加到您的網頁，而不是兩個：通過數據屬性或的JavaScript。所以你應該刪除你的身體屬性或javasript行$('body').scrollSpy({...});
ID屬性對於整個文檔必須是唯一的。您在頁面上有重複的ID。而..在錯誤的地方。在工作小提琴#spy被分配到導航包裝，因爲它是一個被窺探。
導航欄鏈接應指向「可解析的id目標」而不是<a name="service">。你應該使用<a id="service">。
還要確保bootstrap.min.js包含在您的文檔jQuery之後。由於jQuery是Bootstrap所必需的，而不是其他方式。

這裏是一個工作JSFiddle

2017-01-04 15:20:21 aBiscuit

回答