console
$('a').click(function () {
$('html, body').animate({
scrollTop: $($(this).attr("href")).offset().top
}, 500);
return false;
});
<div class="nav">
<a href="#one">one</a>
<a href="#two">two</a>
<a href="#three">three</a>
<a href="#four">four</a>
</div>
<div class="cont">
<div class="box" id="one">1</div>
<div class="box" id="two">2</div>
<div class="box" id="three">3</div>
<div class="box" id="four">4</div>
</div>
.nav span{
display:inline-block;
width:60px;
padding:0 20px;
text-align:center;
cursor:pointer;
}
.box{
width:100%;
height:300px;
background:#fff;
}
.box:nth-child(2n){
background:Red;
}