Не могу получить Scrollspy Bootstrap 3 для работы

Я пытаюсь заставить Scrollspy работать, но он не перемещает мою страницу, чтобы просмотреть элементы в списке. Я также использую data-toggle вместо href. Когда я нажимаю элемент списка я получаю стреляя из него переключая активный класс в консоли разработчика, но страница не перемещается к соответствующему пунктуНе могу получить Scrollspy Bootstrap 3 для работы

HTML

<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>

CSS

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

источник

2015-04-22 Austin

Вы можете создать jsfiddle или jsbin для этого? –

Ваши данные-шпион = "прокрутка" должны находиться в вашем разделе <>.

Я недавно получил эту работу на http://intern-dev.obrary.com/manufacturer. Посмотрите на это в качестве примера.

Я сделал это через JS, вам нужно четыре вещи:

1 - чтобы помечать < тела> раздел соответствующим образом.

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

2 - надлежащим образом привязать ваш навигатор. Ты выглядишь хорошо.

3 - добавить js в голову. Я не вижу этого в вашем примере. Попробуйте

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

4 - убедитесь, что вы обращаетесь к начальной загрузки .js, который включает в себя scrollspy

источник

2015-05-02 22:41:29

Не могу получить Scrollspy Bootstrap 3 для работы

ответ

Смежные вопросы