Correct scrollspy example
Data-target refers to a wrapper, not the nav itself.
HTML
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css">
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/js/bootstrap.min.js"></script>
<div class="container">
<div class="row">
<div id="my-nav" class="span3">
<ul 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 class="span9 my-content">
<section id="moose">
Mooses are cool and big and stuff.
</section>
<section id="bear">
You better stay away from bears, they are bad news.
</section>
<section id="beaver">
Beavers like to slap their tail to scare predators and children.
</section>
<section id="raccoon">
Raccoons like french fries, don't ask me how I know.
</section>
<section id="bobcat">
I would like to know if bobcats go crazy for catnip like my house cat does.
</section>
</div>
</div>
</div>
CSS
.my-content section {
background-color: #f5f5f5;
height: 600px;
}
JavaScript
$(document).ready(function(){
var href = window.location.href;
var splitit = (href.split('#'))[1]; //split url to get sec1 name
if(splitit !== "" || splitit !== "undefined"){
$('html, body').animate({
scrollTop: $('#'+splitit).offset().top
}, 2000);
}
});