title: jquery, hide content until loaded
body: <p>I am currently using this script to fade page transitions:</p>
  
  <pre><code>$(document).ready(function() {
  
      $(window).bind("unload", function() {});
      $("body").css("display", "none");
  
      $("body").hide();
  
      $("body").fadeIn(2000);
  
      $('a.fade1, a.fade2, a.fade3, a.fade4').click(function(event) {
          event.preventDefault();
          linkLocation = this.href;
          $("body").fadeOut(700, redirectPage);
      });
  
      function redirectPage() {
          window.location = linkLocation;
      }
  
  });​
  </code></pre>
  
  <p>this works like a charm when the content is alredy in cache, but when an image needs to load it will momentarily appear then be hidden and faded in</p>
  
  <p>so what i need is a way to hide the content until it is fully loaded and only after that let it be faded in</p>
  
  <p>hope someone can help me, thanks in advance</p>