jQuery Animated Scroll To Top

 / Published in: Other

  1. $(document).ready(function() {
  2. $('.backtotop').click(function(){
  3. $('html, body').animate({scrollTop:0}, 'slow');
  4. });
  5. });

Report this snippet  


RSS Icon Subscribe to comments
Posted By: oronm on October 4, 2009

thanks !!

Posted By: Gregasus on November 24, 2009

I does not seem to work in IE

Posted By: DraStudio on February 1, 2010

I added a return false at the end of it, so if the class is applied to a block level element that contains anchor in it, it won't try to first follow the anchor then animate, which was causing a jitter for me in Firefox.

$(document).ready(function() { $('.backtotop').click(function(){ $('html, body').animate({scrollTop:0}, 'slow'); return false; }); });

Posted By: kopepasah on March 25, 2010

Could not get this to work on my site.

I created a .js file. Referenced the my sites head, but the link would not 'scroll up'.


Posted By: Cisco on April 24, 2010

Works like a charm, thanks! I just re-used the line 3 in my context and that's working perfect!

Posted By: eduardodx on July 12, 2010

Thanks man, really worked. @DraStudio : the 'return false' in the end is the magic for everything works perfectly.

Posted By: tcelestino on August 7, 2010

Nice man!!!

Posted By: tomasdev on November 19, 2010

Oh dear, just awesome. :D

Posted By: jackkeller on December 18, 2010

Great snippet to keep in the arsenal, I was trying to get a similar function to work on a paged form and going about it way more complex with adverse results, this was perfect to add to my .click action!

Posted By: DiegoQ on February 26, 2011

Hi all, what about if I need to scroll to top -or to other divĀ“s wherever they were- from diferents elements...?

The example shows the way to do that from only one element (".backtotop") Im handling diferents functions from diferent elements, including one swf file ;) But I doesnt works if I try to trigger one function from diferents elements :(


Posted By: crispunk on April 11, 2011

you can also use a preventdefault

$(document).ready(function() { $('.backtotop').click(function(e){ $('html, body').animate({scrollTop:0}, 'slow'); e.preventDefault(); }); });

Posted By: danieldue on May 6, 2011

Nice.. works like a charm :) with: returne false..

Posted By: madc on November 17, 2011

Perfect, thanks.

You need to login to post a comment.