Bootstrap和scrollTo.js導航

Question

我是一個新手前端，我有一個難以理解的問題。在我的頁面上，當您點擊頂部菜單中的鏈接時，它會滾動到所需的塊。但是，除非用戶將頁面向下滾動幾個像素，否則該鏈接不會標記爲活動狀態。爲什麼會發生這種情況，我該如何解決？ 這裏的HTML：

  <nav class="menu"> 
       <div class="nav-collapse"> 
        <ul class="nav"> 
        <li><a data-action="scrollTo" href="#content" class="hover">Download</a></li> 
        <li><a data-action="scrollTo" href="#productfeatures">Product Features</a></li> 
        <li><a data-action="scrollTo" href="#howitlooklike">How it look like</a></li> 
        <li><a data-action="scrollTo" href="#mobile">Mobile Version</a></li> 
        <li><a data-action="scrollTo" href="#footer">Contacts</a></li>  
        </ul> 
       </div> 
      </nav><!-- Nav End--> 

如果您刷新頁面，滾動 - 活動鏈接將會出現。

所有代碼，你可以看到here

Answer 1

如果您使用的引導，那麼爲什麼不使用它的「ScrollSpy」 JS組件？

它易於使用，並允許設置偏離窗口的頂部，這是您的網站現在的根本問題。它的激活基於從頂部的位置，而你有固定的導航。

您可以使用'ScrollSpy'並設置比您的NAV元素高度略高的偏移量。此外，每次激活新導航鏈接時，都會激活「激活」事件。所以，這應該爲你做的伎倆。

這裏的鏈接：http://getbootstrap.com/javascript/#scrollspy