jQuery: Animated scroll to element

Alot of sites will just link to an anchor on the page and throw the user straight to it. For a person who is new to browsing, that can be pretty confusing.

TruckWheel
To some users, being thrown directly to an anchor may feel like this...

To smoothly scroll your screen to a specific element, use this one liner to help make your site much nicer to navigate:

$('html,body').animate({ scrollTop: $(element).offset().top }, { duration: 'slow', easing: 'swing'});

Slightly modified from source to allow for different types of easing.

You may want to combine this effect with URL anchors for easier hot-linking.

[ Source, jQuery Docs ]

 
Copyright © Twig's Tech Tips
Theme by BloggerThemes & TopWPThemes Sponsored by iBlogtoBlog