本文介绍了Twitter Bootstrap Scrollspy仅突出显示最后一项的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我一直在使用Twitter Bootstrap Scrollspy插件,但对于我的生活,我无法让它工作。以下是内容区域的HTML

I have been working a Twitter Bootstrap Scrollspy plugin, but for the life of me I can not get it to work. Here is the HTML for the content area

<div data-spy="scroll" >
  <section id="page_home" class="page_home" style="width:100%;background-color:rgb(245,245,245);">
    <div class="container">
      Home
    </div>
  </section>

  <section id="page_projects" class="page_projects" style="width:100%;background-color:rgb(25,25,25);">
    <div class="container">
      Projects
    </div>
  </section>

  <section id="page_services" class="page_services" style="width:100%;background-color:rgb(245,245,245);">
    <div class="container">
      Services
    </div>
  </section>

  <section id="page_downloads" class="page_downloads" style="width:100%;background-color:rgb(25,25,25);">
    <div class="container">
      Downloads
    </div>
  </section>

  <section id="page_about" class="page_about" style="width:100%;background-color:rgb(245,245,245);">
    <div class="container">
      About
    </div>
  </section>

  <section id="page_contact" class="page_contact" style="width:100%;background-color:rgb(25,25,25);">
    <div class="container">
      Contact
    </div>
  </section>
</div>

这里是导航栏的HTML代码

and here is the HTML code for the nav bar

<div id="navbar" class="navbar navbar-inverse navbar-fixed-bottom">
  <div class="navbar-inner">
    <div class="container">
      <ul class="nav">
        <li><a href="#page_home">Home</a></li>
        <li><a href="#page_projects">Projects</a></li>
        <li><a href="#page_services">Services</a></li>
        <li><a href="#page_downloads">Downloads</a></li>
        <li><a href="#page_about">About</a></li>
        <li><a href="#page_contact">Contact</a></li>
      </ul>
    </div>
  </div>
</div><!-- /.navbar -->

我看了一些其他帖子,但对于我的生活,我无法想象为什么只选择导航栏中的最后一项。

I have looked at some of the other post, but for the life of me I can't figure out why it is only selected the last item in the navigation bar.

任何人都可以帮我弄清楚为什么scrollspy只选择最后一项以及如何纠正它? / p>

Could anyone help me figure out why scrollspy is only selecting the last item and how to correct it?

推荐答案

这是您要监视的正文

而不是

<div data-spy="scroll" >

使用

<body data-spy="scroll" data-target="#navbar">

这篇关于Twitter Bootstrap Scrollspy仅突出显示最后一项的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-02 18:01