Bootstrap Scrollspy無法檢測到導航

我正在爲我的學校構建一個活動網站。我正在實現一個側欄，它在視口中改變網站不同部分的顏色。我無法做出滾動式的工作。Bootstrap Scrollspy無法檢測到導航

這是我有：https://codepen.io/aahlfeeyann/pen/oeBGdq

<body data-spy="scroll" data-target="#sidebar"> 
    <div class="wrapper"> 
    <nav id="sidebar"> 
     <ul class="sidebar visible"> 
     <li id="step1" class="active"> 
      <a href="#hero"> 
      <span>Home</span> 
      </a> 
     </li> 
     <li id="step2"> 
      <a href="#about"> 
      <span>About this Campaign</span> 
      </a> 
     </li> 
     <li id="step3"> 
      <a href="#mvps"> 
      <span>Our Participants</span> 
      </a> 
     </li> 
     <li id="step4"> 
      <a href="#appreciation"> 
      <span>How to fight Procrastination</span> 
      </a> 
     </li> 
     <li id="step5"> 
      <a href="#details"> 
      <span>Event Details</span> 
      </a> 
     </li> 
     <li id="step6"> 
      <a href="#team"> 
      <span>Our Team!</span> 
      </a> 
     </li> 
     </ul> 
    </nav> 
    <div class="bg-wrapper"> 
     <div class="section" id="hero"> 
     </div> 
     <div class="section" id="about"> 
     <h1>About the Campaign</h1> 
     </div> 
     <div class="section" id="mvps"> 
     <h1>Our Participants</h1> 
     </div> 
     <div class="section" id="appreciation"> 
     <h1>Appreciation...?</h1> 
     </div> 
     <div class="section" id="details"> 
     <h1>Event Information</h1> 
     </div> 
     <div class="section" id="team"> 
     <h1>About the Team</h1> 
     </div> 
    </div> 
    </div> 

</body>

來源

2017-08-06 aahlfeeyann

添加nav類ul元素。作爲每引導文檔

Scrollspy目前需要用於激活鏈接的合適高亮使用自舉NAV組分。

HTML

<ul class="sidebar visible nav"> 
..... 
... 
.. 
. 
</ul>

Scrollspy Docs Reference

希望這有助於..

來源

2017-08-07 04:31:44

嗨這個工作！非常不注意我沒有注意到我沒有導航。謝謝！ – aahlfeeyann

@aahlfeeyann，酷...快樂編碼...：D –

Bootstrap Scrollspy無法檢測到導航

回答

相關問題