我需要有关我的 bootstrap scrollspy 设置的帮助。它突出显示了错误的 div id(总是最后一个)。任何人都可以帮助我吗？
代码:
内容:
<body style="heigt: 100%" data-spy="scroll" data-target="#side-menu">
<div class="container-fluid">
<div class="row">
<nav id="side-menu" class="col-xs-3 bs-docs-sidebar" data-gumshoe-header>
<ul class="nav nav-stacked fixed" data-gumshoe>
<li>
<a href="#GroupA">Group A</a>
</li>
<li>
<a href="#GroupB">Group B</a>
</li>
<li>
<a href="#GroupC">Group C</a>
</li>
</ul>
</nav>
<div class="col-md-9">
<div id="GroupA">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</div>
<br><br><br><br><br><br><br><br><br>
<div id="GroupB">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</div>
<br><br><br><br><br><br><br><br><br>
<div id="GroupC">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</div>
</div>
</div>
</div>
</body>
//编辑:页面图片
我正在使用 Bootstrap 3.3.7 和 JQuery 2.2.4。
问候
最佳答案
滚动的元素应该是position: relative风格。
引用:http://getbootstrap.com/javascript/#requires-relative-positioning
编辑
您的 div 高度太小。滚动区域是 scroll-spy 的简称。
工作 fiddle :https://jsfiddle.net/o93q4maf/
编辑2
作为@Lars mentioned问题是拼写错误:style="heigt: 100%" 而不是 body 元素中的 style="height: 100%"。
关于javascript - Bootstrap Scroll Spy 突出显示错误的 id，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44899153/