Question

我正在尝试让Scrollspy工作，但它没有移动我的页面来查看列表中的项目。我也在使用href而不是<div class="panel-body"> <div class="row col-sm-7" style="position:fixed; background:white"> <div id="myScrollspy"> <ul class="nav navbar-nav" style="border:none"> <li class="active"><a data-toggle="tab" data-target="#Java-clients-section-1">Section One</a></li> <li><a data-toggle="tab" data-target="#Java-clients-section-2">Section Two</a></li> <li><a data-toggle="tab" data-target="#Java-clients-section-3">Section Three</a></li> </ul> </div> </div> <div class="informationDiv" data-spy="scroll"> <span id='Java-clients-section-1'>createChecking</span> <br /> Some stuff la la la la la la la la la la la la la la la la la la la <br /> la la la la la la la la la la la la la la la la la la la la la la la la <br /> la la la la la la la la la la la la la la la la la la la la la la la la <span id='Java-clients-section-2'>confirmChecking</span> <br /> Some stuff la la la la la la la la la la la la la la la la la la la <br /> la la la la la la la la la la la la la la la la la la la la la la la la <br /> la la la la la la la la la la la la la la la la la la la la la la la la <span id='Java-clients-section-3'>listChecking</span> <br /> Some stuff la la la la la la la la la la la la la la la la la la la <br /> la la la la la la la la la la la la la la la la la la la la la la la la <br /> la la la la la la la la la la la la la la la la la la la la la la la la </div> </div>。当我点击一个列表项时，我开始关闭它在开发者控制台中切换活动类，但页面没有移动到正确的项目

HTML

.informationDiv {
  height: 450px;
  overflow: scroll;
  overflow-x: hidden;
  padding-top:50px;
}

CSS

{{1}}

Answer 1

你的data-spy =“scroll”需要在你的＆lt;身体＆gt;部分。

我最近在http://intern-dev.obrary.com/manufacturer开始工作了。以此为例。

我是通过js做到的，你需要做四件事：

1 - 标记你的＆lt;身体＆gt;适当的部分。

<body class="scroll-area" data-spy="scroll">

2 - 正确标记导航栏。你的看起来不错。

3 - 将js添加到头部。我在你的例子中没有看到这一点。试试

<script>$(document).ready(function(){
$(".scroll-area").scrollspy({target: "#navbar-example2"}) 
});</script>

4 - 确保您正在访问包含scrollspy

的bootstrap .js

无法让Bootstrap 3的Scrollspy工作

1 个答案: