Animate to a specific div using jquery

I am really impressed about sites tha have a fixed menu and when user clicks on it, whole page animates to a specific div.

Have a look at this wonderful site, to see what I mean (click onto the image)

Really impressive, ha! Are you still here? Well for those you came back to learn this technique, it's time to realize how simple it is.

We just use jquery's animate method, and all magic happens to the site. Really cool! But to be more specific, you can read the following function:

Let me just explain it a little bit.

This function takes the id of the targeting div as parameter  (we will explain how we call it later).

First of all we define the animation speed and the easing type. So, you have to dowload Jquey Easing Plugin first.

After defining the variables, we just check if it's a webkit browser (Google Chrome), because webkit browsers do not support animate-html.

We then call the animate method (be careful!! before calling animate(), we call stop() ), and that's all.


The HTML
Just put an anchor tag on your page and on click, call the Animate2id('#news') function, which animates to a div with id=news.