文章/答案/技术大牛

发布

社区首页 >问答首页 >Bootstrap Scrollspy不工作

问Bootstrap Scrollspy不工作
EN

Stack Overflow用户

提问于 2013-03-08 14:46:02

回答 1查看 15.9K关注 0票数 2

我正在尝试实现一个固定的侧边菜单，它用活动类更新活动页面链接。我把卷轴间谍HTML5元素放在身体上，但我有问题。是否有人可以查看我的页面，看看他们是否能确定哪里出了问题？

http://mattaltepeter.com/new/about.shtml

twitter-bootstrap

scrollspy

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-03-08 19:17:33

问题是，您已经将您的导航放在一个div中，然后使用滚动中的导航id。为了让scrollspy正常工作，你可以将"side-nav“赋值给span3 div，比如: Jsfiddle demo in browser

<div class="row">
<div class="span3" id="side-nav">
    <ul class="nav nav-list about-list hidden-phone hidden-tablet affix" >
        <li class="active"><a href="#about"><i class="icon-chevron-right"></i> About Me</a></li>
        <li><a href="#education"><i class="icon-chevron-right"></i> Education</a></li>
        <li><a href="#work"><i class="icon-chevron-right"></i> Work Experience</a></li>
        <li ><a href="#sports"><i class="icon-chevron-right"></i> Sports</a></li>
    </ul>
</div>

您可以通过以下方式创建您的para部分：

<div class="page-header" id="about">
        <h1 >About Me</h1>

    <p>My name is Matt Altepeter. I am 21 years old .</p>
    </div>

请删除脚本以初始化滚动，因为您已将它们添加到正文中

<body data-offset="50" data-target="#side-nav" data-spy="scroll">

在jquery之后和其他脚本之前声明bootstrap.js是一种很好的做法。将所有脚本放在页脚中，有助于节省加载时间。

  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>

票数 8

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/15288285

复制

相似问题

问Bootstrap Scrollspy不工作
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Bootstrap Scrollspy不工作EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Bootstrap Scrollspy不工作
EN