Question

I’m a noob with jQuery and I know about scrollTo, but not quite how to get it to function on my site. I did a quick Google search and found lots of results, but at a glance the most reliable one (or at least most popular) currently used is this one: http://plugins.jquery.com/project/ScrollTo

However, again, being a total noob to scripting, not exactly sure how to use it to accomplish my task. (HTML and CSS are my bag, baby).

So here’s what I’m trying to do…very simple stuff I’m sure.

On http://joelglovier.com I’m building a one page “gateway” site with links to lots of my other fun web content. I have a top navigation which simply just links to anchors further down the page. All I want is for scrollTo to take my users down to those anchors in a nice, animated fashion. Told you this was simple!

Any help appreciated on the best way to implement this, and whether there is a current standard for this type of scrollTo use (I see it everywhere nowadays).

Answer 1

refer : .offset(), .scrollTop() , .animate()

you can do some thing like

$(function() {
    $('#nav-find-me-at a').click(function() {
        var pos = $('#find-me-at').offset().top;
        $('html, body').animate({'scrollTop' : pos}, 1000);
            return false;
    });
});

edit :
test it here : http://jsbin.com/ecaye