title: Change URL in browser address bar without reload existing page
body: <blockquote>
    <p><strong>Possible Duplicate:</strong><br>
    <a href="https://stackoverflow.com/questions/824349/modify-the-url-without-reloading-the-page">Modify the URL without reloading the page</a>  </p>
  </blockquote>
  
  
  
  <p>I'm looking for a way to make my internal links functional using my current javascript animations, without causing the page to reload when you click on them - <strong>but I would like the URL to update in the browser</strong>.</p>
  
  <p>Many websites do this, here is a good example: <a href="http://grooveshark.com/#!/search?q=adf" rel="noreferrer">http://grooveshark.com/#!/search?q=adf</a></p>
  
  <p>How do they get the URL to update without the page reloading?</p>
  
  <hr>
  
  <p>More details:</p>
  
  <p>Currently a link on my page looks like <code>&lt;a href="#aboutus"&gt;About Us&lt;/a&gt;</code>, this takes you to <code>&lt;div id="aboutus"&gt;&lt;/div&gt;</code> via javascript.</p>
  
  <p>The javascript looks something like:</p>
  
  <pre><code>$("#navigation a").click(function(e){
    animate(..scroll to section..);
    e.preventDefault(); // &lt;==========
  });
  </code></pre>
  
  <p>I believe the "e.preventDefault()" is what is causing the URL to not be updated, but how do I prevent the browser from reloading the page when the URL is changed?</p>
  
  <p>How do other websites do it? What is this method called (so I can further research it)?</p>
  
  <p>thanks.</p>