Bootstrap ScrollSpy 不工作 [英] Bootstrap ScrollSpy isn't working
问题描述
我有以下 jsfiddle 项目用于测试 BootSTrap 的 ScrollSpy 功能
I have the following jsfiddle project I am using to test the ScrollSpy feature of BootSTrap
该演示有 5 个指向页面部分的链接,并且这些链接有效.但是,向下滚动页面不会激活导航菜单.此外,我注意到在运行 jsfiddle 时,我的导航中的最后一个菜单选项是灰色的.因为我的导航中的第一个选项在页面下方,所以我认为不会突出显示中殿.
The demo has 5 links to sections of the page and the links work. However, scrolling down the page does not activate the nav menus. Futhermore, I notice that upon running the jsfiddle the very last menu option in my nav is gray. Because the first option in my nav is down the page a bit I would think no nave would be highlighed.
我没有看到我做错了什么??
I am not seeing what I doing wrong??
<section class="navspy">
<ul id="navigation" class="nav nav-tabs nav-stacked affix" style="width:200px">
<li><a href="#patientInfo">Patient Info</a>
</li>
<li><a href="#EmergencyContactInfo">Emergency Contact</a>
</li>
<li><a href="#EmploymentInfo">Employement Info</a>
</li>
<li><a href="#GuardianInfo">Guardian Info</a>
</li>
<li><a href="#InsuranceInfo">Insurance Info</a>
</li>
</ul>
</section>
感谢您的帮助.
更新:3/5/2013-JSFiddle 链接现在正确
Updated: 3/5/2013-JSFiddle link now correct
推荐答案
body标签的使用方法如下:
Use the body tag in the following way :
带有演示
<body data-spy="scroll" data-target=".navspy">
您使用的是没有 # tag 的 id 导航.也为了让 scrollspy 工作,在数据目标的正文中使用部分 id.
you were using id navigation without # tag . Also for scrollspy to work use the section id to in the body for data-target.
由于您已经在 body 标签中指定了 data-spy 和 data-target,因此无需通过 javascript 进行初始化.
Since you already have the data-spy and data-target specified in body tag no need to initialize via javascript .
这篇关于Bootstrap ScrollSpy 不工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!