2013-09-27 78 views
0

我有Bootstrap的兩個問題:我不能在我的Boostrap網站上添加ScrollSpy和平滑滾動。Bootstrap:ScrollSpy和平滑滾動

<body data-spy="scroll" data-target="#test"> 
<nav class="navbar navbar-default navbar-fixed-top" role="navigation"> 
<!-- Brand and toggle get grouped for better mobile display --> 
<div id="test" class="navbar-header"> 
<button type="button" class="navbar-toggle" data-toggle="collapse" data- target=".navbar-ex1-collapse"> 
    <span class="sr-only">Toggle navigation</span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
</button> 
<a class="navbar-brand" href="#">L</a> 
</div> 

<!-- Collect the nav links, forms, and other content for toggling --> 
<div id="test" class="collapse navbar-collapse navbar-ex1-collapse"> 
<ul class="nav navbar-nav"> 
    <li class=""><a href="#Chi Sono">Chi Sono</a></li> 
    <li><a class="scroll" href="#Conoscenze">Conoscenze</a></li> 
    <li><a href="#OS" >Sistemi operativo</a></li> 


</div><!-- /.navbar-collapse --> 
    </nav> 

這是導航欄代碼。我嘗試了很多解決方案,但無濟於事。我如何添加這種效果?

回答

0

取代

 <div id=test ...> 

 <nav id=test...> 

與任何自舉.nav組件的父元素的ID或類中添加數據目標屬性。由於您在爲滾動數據定義數據目標ID時使用了div,因此無法工作。使用導航來代替 http://getbootstrap.com/javascript/#scrollspy

而另一誤差在這部分代碼在這裏

</div><!-- /.navbar-collapse --> 
</nav> 

做導航欄崩帶導航標籤不div標籤。

所以正確的代碼是

</nav><!-- /.navbar-collapse --> 
</nav> 
+0

不起作用。這是一個新代碼http://pastebin.com/igRzxQBq –

+0

你的代碼中還有一個語法錯誤。結束標記是導航,而不是div。所以在最後一行改變結束標記。 –

+0

如果我的回答是正確的,請點擊正確答案按鈕。謝謝。 –