Add Dynamic Scroll to Top Button to Your Web Pages

by

While reading lengthy web pages, readers often look for a link that’ll take them back to the top of the page without having to scroll upwards. Here’s a nice jQuery plugin that'll add a dynamic Scroll To Top link to your web pages. It is dynamic in the sense that it won’t show up when user is at the top of the page and will slowly fade in when page is scrolled down.

To add this dynamic Scroll to Top button, download this Scroll to Top plugin written by Craig Wilson of Ph.Creative and add a reference of jquery and this plugin in your header.

Now add a link to your web page html somewhere near your page header that'll act as Scroll to Top button.

<a id=”goToTop” href=”#” >Go To Top</a>

Now in your jQuery Ready function, add these lines to make Go To Top link dynamic.

$(“#goToTop”).scrollToTop();