Edit in JSFiddle

$('a[href*="#"]').click(function(event){
        event.preventDefault();
        var f = this.href;
        var p = f.split("#");
        var t = p[1];
        var to = $("#"+t).offset();
        var tt = to.top;
        $('html, body').animate({scrollTop:tt},500);
    });
div{margin-bottom:2000px;}
#bottom{font-size:25px;}
<div id="top">HOME or go <a href="#bottom">bottom</a></div>
<a href="#top" id="bottom">top</a>