我在使用 Bootstrap 时遇到两个问题:我无法在我的 Boostrap 网站上添加 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>
这是导航栏代码。我尝试了很多解决方案，但无济于事。如何添加此效果？
最佳答案
替换
<div id=test ...>
与
<nav id=test...>
使用任何 Bootstrap .nav 组件的父元素的 ID 或类添加 data-target 属性。由于您在为 scrollspy 定义数据目标的 id 时使用 div，因此它不起作用。改用导航 http://getbootstrap.com/javascript/#scrollspy
这部分代码还有另一个错误
</div><!-- /.navbar-collapse -->
</nav>
使用 nav 标签而不是 div 标签做 navbar-collapse。
所以正确的代码是
</nav><!-- /.navbar-collapse -->
</nav>
关于javascript - Bootstrap : ScrollSpy and smooth scroll，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19060300/