title: How to "animate" the transition between pages with jquery's .load()
body: <p>I have this ajax site, with pages loading through <code>load()</code> but how do I add a transition? A simple FadeOut + FadeIn would be good already.</p>
  
  <p>This is the code I'm using to load it (plus a loading indicator).</p>
  
  <p>I want the current page (just container) fadeout and the new one arrives with fadeIn</p>
  
  <pre><code>$(document).ready(function() {
      $('a').click(function(event) {
          $("#container").append('&lt;div id="loading"&gt;Loading...&lt;/div&gt;');
          event.preventDefault();
          var url = $(this).attr('href');
          $('div#container').load(url, function() { $("#loading").fadeOut() });
      });
  });
  </code></pre>