Wait till image is loaded and resized before triggering animation?
<pre><code>$("#body-background").ezBgResize();
$("#nav").animate({
        left: "-725px"
    }, 800, "easeOutCirc" );
    $("#page .home").animate({
            right: "0px"
    }, 800, "easeOutCirc" );
</code></pre>

<p>This is essentially my code.  </p>

<p>The first line uses jQuery Easy Background Resize: (ref: <a href="http://johnpatrickgiven.com/jquery/background-resize/" rel="nofollow">http://johnpatrickgiven.com/jquery/background-resize/</a>)</p>

<p>In the HTML, you put something like this:</p>

<pre><code>&lt;!-- This gets positioned absolutely so place it anywhere. --&gt;
&lt;div id="body-background"&gt;&lt;img src="image/bg.jpg" alt="Bg"&gt;&lt;/div&gt;
</code></pre>

<p>The problem I'm having is that the image takes so long to load the first time, the animations don't fire...and skip to the end. Anyway I can delay the animation till after the resize is complete?</p>

<p>Thanks in advance.</p>

<p>Edit: The site I'm working on: <a href="http://jsc.yondershorecreative.com/" rel="nofollow">http://jsc.yondershorecreative.com/</a></p>
