JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-scrollspy.js"></script>
<div id="menu">
  <ul class="nav nav-list"> 
    <li><a href="#one">One</a></li>
    <li><a href="#two">Two</a></li>
    <li><a href="#three">Three</a></li>
    <li><a href="#four">Four</a></li>
    </ul>
</div>
   <div id="scroll-in">
       <div id="one">One</div>
       <div id="two">Two</div>
       <div id="three">Three</div>
       <div id="four">Four</div>
       <div></div>
    </div>
 </body>
</html>

CSS

#scroll-in {
  border: 1px solid #000;
  height: 100px;
  width: 100%;
  overflow-y: scroll;
}

#scroll-in div {
  width: 100%;
  height: 100%;
}
#one { background: #f00;}
#two { background: #0f0;}
#three { background: #ff0;}
#four { background: #0ff;}

JavaScript

// Remove the line bellow and everything is fine
//window.location.hash = '#three'
$('#scroll-in').scrollspy({target: '#menu', offset: 130})