javascript - Scrollspy on hidden sections -

i can't seem scrollspy work hidden elements.

i place data-spy="scroll" on body, , data-target=".classofnavwrapper", , doesn't ignore hidden elements docs imply, rather seems choose elements activate @ random.

here's fiddle: http://jsfiddle.net/shdapqap/1/

<div class="container">   <div class="row">     <div class="span3">       <div class="nav-wrapper">           <ul id="my-nav" class="nav nav-list affix">             <li><a href="#moose">moose</a></li>             <li><a href="#bear">bear</a></li>             <li><a href="#beaver">beaver</a></li>             <li><a href="#raccoon">raccoon</a></li>             <li><a href="#bobcat">bobcat</a></li>           </ul>       </div>     </div>     <div class="span9 my-content">       <section id="moose">           mooses cool , big , stuff.       </section>       <section id="bear">           better stay away bears, bad news.       </section>       <section id="beaver">           beavers slap tail scare predators , children.       </section>       <section id="raccoon" class="hidden">         raccoons french fries, don't ask me how know.       </section>       <section id="bobcat" class="hidden">         know if bobcats go crazy catnip house cat does.       </section>         <button class="show">show next</button>     </div>   </div> </div> 

on bottom show next button.. shows next hidden div , refreshes scrollspy, seems work fluently once last hidden class removed.

bootstrap version: 2.2.2 (stuck that).

i solved replacing scrollspy part of bootstrap 2.2.2 js scrollspy part bootstrap 3.3.5. , of course, remembering refresh scrollspy after revealing each item.