jquery, hide content until loaded
<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>
