title: JavaScript Smooth Scroll Explained
body: <p>I have seen the following code snippet on a number of pages. I understand that it is used for smooth scrolling according to different id anchor tags. However, I am still  a little confused about what/how the regex replacement, <code>this</code>, and <code>hash</code> variables work.</p>
  
  <p>What exactly is this frequent code snippet doing? </p>
  
  <pre><code>$(function() {
          $('a[href*=#]:not([href=#])').click(function() {
              if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') || location.hostname == this.hostname) {
  
                  var target = $(this.hash);
                  target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
                  if (target.length) {
                      $('html,body').animate({
                          scrollTop: target.offset().top
                      }, 1000);
                      return false;
                  }
              }
          });
  });
  </code></pre>