Creating a Scrolling Back to Top Button with jQuery

If you take a look way, way, way down at the bottom of this page, you will see a Back to Top button that scrolls the whole page until it reaches to top. It is a pretty simple effect to add to your site and looks a hundred-times cooler than just using your typical anchor name and link. Getting it all to work takes nothing more than a few lines of jQuery version 1.4.2. First, we need to create our button/link. I am just going to use an anchor tag and some text:
Back to Top
Next we need to add some jQuery between the <head> tags:


Remember, you can change the speed by replacing slow with a numerical value. You can also add some easing effects by including the jQuery UI. Read more about easing effects here.
Search

Popular Posts

Small Biz Website Tips Newsletter

Stay up to date with the latest marketing, sales, and service tips and news.

Small Biz Website Tips Newsletter

Stay up to date with the latest marketing, sales, and service tips and news.