Posted By

vagrantradio on 02/16/10


Tagged

scroll page jquery links animation Karl Swedberg


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

JamesFillingham


JQUERY PAGE SCROLL


 / Published in: jQuery
 

URL: http://www.learningjquery.com/2007/09/animated-scrolling-with-jquery-12

Any link with a hash (#) will scroll to that id on the page. Hat Tip, Karl Swedberg.

  1. <script type="text/javascript">
  2. $(document).ready(function(){
  3. //back to top scroll function. Any link with a hash (#) will scroll to that id on the page
  4. $('a[href*=#]').click(function() {
  5. if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
  6. && location.hostname == this.hostname) {
  7. var $target = $(this.hash);
  8. $target = $target.length && $target
  9. || $('[name=' + this.hash.slice(1) +']');
  10. if ($target.length) {
  11. var targetOffset = $target.offset().top;
  12. $('html,body')
  13. .animate({scrollTop: targetOffset}, 500);
  14. return false;
  15. }
  16. }
  17. });
  18. });
  19. </script>

Report this snippet  

Comments

RSS Icon Subscribe to comments
Posted By: vagrantradio on September 24, 2010

Should be noted that this doesn't work properly in Opera or on mobile devices such as iPad or Android phones.

You need to login to post a comment.