title: AJAX deeplinking with jQuery Address
body: <p>I have a website which has many pages:</p>
  
  <blockquote>
    <p>For example:</p>
    
    <p>HOME: <code>http://mywebsite.com/index.html</code></p>
    
    <p>SOME PAGE: 
    <code>http://mywebsite.com/categorie/somepage.html</code></p>
  </blockquote>
  
  <p>I decided to make my pages load dynamically with AJAX without reloading the page. So I decided to use <em>jQuery Address</em> plugin ( <a href="http://www.asual.com/jquery/address/docs/" rel="nofollow noreferrer">http://www.asual.com/jquery/address/docs/</a> ) in order to allow deeplinking and Back-Forward navigation: </p>
  
  <pre><code>&lt;script type="text/javascript" src="uploads/scripts/jquery.address-1.2rc.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
                  $('a').address(function() {
                      return $(this).attr('href').replace(/^#/, '');
                  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Now, after installing the plugin, if I go on <code>http://mywebsite.com/index.html</code> <em>(HOME)</em> and click on <em>SOME PAGE</em> link, jquery successfully loads the <code>http://mywebsite.com/categorie/somepage.html</code> without reloading the page and the address bar on my browser displays: 
  <code>http://mywebsite.com/index.html/#/categorie/somepage.html</code> which is great!</p>
  
  <p>However, <strong>the problem</strong> is: if I copy this dynamically generated URL: <code>http://mywebsite.com/index.html/#/categorie/somepage.html</code>
  into a web browser address bar, it will take into my website <em>index.html</em> page and not to the "SOME PAGE" page. Also, The Forward/Back buttons don't work correctly, they only replace the address in the URL bar but the content stays the same.</p>
  
  <p>I suppose that I need to write some JavaScript rule that associates the dynamic URL with the correct page?</p>
  
  <p>Some help would be appreciated. Thanks :)</p>