Якорная прокрутка

HTML

<a name="top"></a>
<a href="#Gosha">Гоша</a>
<a href="#Petr">Петя</a>
<a href="#Igor">Игорь</a>
<hr/>
    <a name="Gosha">Гоша</a> <a href="#top">↑</a>
<div class="razd"></div>
    <a name="Petr">Петя</a> <a href="#top">↑</a>
<div class="razd"></div>
    <a name="Igor">Игорь</a> <a href="#top">↑</a>
<div class="razd"></div>

CSS

.razd{
    height: 600px;
}
a[href='#top']{
    text-decoration: none;
    color: red;
}

JavaScript

jQuery(function ($) {
    $(this).on('click', 'a[href^=#]', function () {
        var el = $('a[name="' + this.hash.slice(1) + '"]')
        $('html, body').animate({
            scrollTop: el.offset().top
        }, 1000, function () {
              el.fadeOut()
                .fadeIn()
                .fadeOut()
                .fadeIn()
                .fadeOut()
                .fadeIn();
        });
        return false;
    });
});