advanced code snippet search

Smooth Scrolling with jQuery and internal page links

 / Published in: JavaScript
 

URL: http://www.smashingmagazine.com/2009/02/20/ask-sm-css-smooth-page-scrolling-divs-of-equal-height-dealing-with-ie-6/

From the "Ask Smashing Magazine" article on 2-20-09.

Using jQuery, this allows for a smooth scrolling effect when you have links at the top of a page pointing to internal links within the page. A good example of this would be an F.A.Q. page.

Expand | Embed | Plain Text 
  1. $(function(){
  2.  
  3.     $('a[href*=#]').click(function() {
  4.  
  5.     if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') 
  6.         && location.hostname == this.hostname) {
  7.  
  8.             var $target = $(this.hash);
  9.  
  10.             $target = $target.length && $target || $('[name=' + this.hash.slice(1) +']');
  11.  
  12.             if ($target.length) {
  13.  
  14.                 var targetOffset = $target.offset().top;
  15.  
  16.                 $('html,body').animate({scrollTop: targetOffset}, 1000);
  17.  
  18.                 return false;
  19.  
  20.             }
  21.  
  22.         }
  23.  
  24.     });
  25.  
  26. });

Report this snippet  

Comments

RSS Icon Subscribe to comments
Posted By: vaniinstitute_hyderabad1991 on February 24, 2009

vani institute for gate coaching

You need to login to post a comment.