Использование bootstrap scrollspy для div с коллапсом, прикрепленной боковой панелью

Question

У меня этот код как макет страницы. Разделитель span9 разделяет разделы, которые должны применять scrollspy. Каждый раздел представляет собой набор сворачиваемых div, которые содержат фактическое содержимое. DivX span3 является прикрепленной боковой панелью и должен выделять правильный элемент с помощью scrollspy.

<div class="span3 module-sidebar"> 
    <ul id="sidebar" data-spy="affix" data-offset="250" data-offset-bottom="0" class="nav nav-list bs-docs-sidenav affix"> 
     <li> 
      <a href="#module1"><i class="icon-chevron-right"></i>Module1 Name</a> 
     </li> 
    </ul> 
</div> 

<div class="span9" data-spy="scroll" data-target="#sidebar"> 
    <section id="module1"> 
     <div class="page-header"> 
      <h1>Module1 Name</h1> 
     </div> 

     <div class="bs-docs-example"> 
      <div class="accordion" id="accordion2"> 
       <div class="accordion-group"> 
        <div class="accordion-heading"> 
         <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#function1">Function1 Name</a> 
        </div> 
        <div id="function1" class="accordion-body collapse in"> 
         <div class="accordion-inner"> 
         <h3>Topic1 Name</h3> 
         <p>Topic1 Desc</p>        
          <h4>SubTopic1 Name</h4> 
          <p>SubTopic1 Desc</p>         
           <h4><img src="../assets/img/manuals/module1/function1/step1.png"/></h4> 
           <p>Step1 Desc</p> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </section> 
</div> 

Проблема заключается в том, что, когда я свернуть DIV, чтобы показать содержимое, scrollspy не признает вновь занимаемое пространство этих разборных дел. и таким образом выделяет следующие элементы на боковой панели, когда я просматриваю содержимое этого разборного div.

Я хочу, чтобы scrollspy «увидела» пространство, когда разворачивается расширяемый div. Любая помощь будет действительно оценена. Нажмите here для скрипки.

Answer 1

Вы должны позвонить .scrollspy('refresh'):

$(document).ready(function() { 

    $('.accordion').on('shown hidden', function() { 
     $('body').scrollspy('refresh'); 
    }); 

});