bootstrap scrollspy在加载后突出显示上一个导航链接按钮

Question

bootstrap scrollspy在加载后突出显示上一个导航链接按钮

Alo*_*lon 13 javascript css jquery twitter-bootstrap twitter-bootstrap-2

我在顶部建了一个导航栏,有5个链接.在页面本身,我根据元素中#标签后面的名称添加了5个带id的部分.问题是最后一个导航链接按钮被突出显示("活动"类在开始时在运行时添加到它,尽管在代码本身中第一个导航栏项设置为"活动".我有最新的引导版本,即v2 .0.4有什么问题？

<div class="navbar" id="MenuBar">
    <div class="topHeadContentLogo"></div>
    <ul class="nav nav-pills" id="MenuUl">
        <li class="active"><a href="#Weekly">Weekly</a></li>
        <li class=""><a href="#Post">Post</a></li>
        <li class=""><a href="#Audience">Audience</a></li>
        <li><a href="#Website">Website</a></li>
        <li><a href="#FAQ">FAQ</a></li>
    </ul>
</div>

<div id="contentDiv">
    <section id="Weekly">
        <h1>weekly</h1>
    </section>

    <section id="Post">
        <h1>Post</h1>
    </section>

    <section id="Audience">
        <h1>Audience</h1>
    </section>

    <section id="Website">
        <h1>Website</h1>
    </section>

    <section id="FAQ">
        <h1>FAQ</h1>
    </section>
</div>



$('#MenuBar').scrollspy(); after document ready

Run Code Online (Sandbox Code Playgroud)

Answer 1

Bar*_*ers 12

如果元素data-spy上有body集合,请确保body元素未设置为height: 100%;.这是我的问题.

Answer 2

Luc*_*uca 4

您是否已添加data-spy="scroll"到<body>标签（或任何其他相关标签）？

您是否尝试过向不同部分添加足够的内容，以便它们不会同时出现在您的浏览器窗口中？我已经在我构建的引导页面中尝试了您的代码，似乎一切正常。我只是在这些部分中添加了很多文本，以确保浏览器窗口中一次只显示一个文本。 (2认同)

归档时间：	13 年，12 月前
查看次数：	9672 次
最近记录：	9 年前