Animate when the first image is loaded <p>I want to animate an element only when this element is loaded ( with the background ). I tryed this but doesn't work:</p> <p>CSS:</p> <pre><code>#topimg{ background: rgba(0, 0, 0, 0) url(../img/bg.jpg) 0 0 no-repeat fixed; background-size: cover; } </code></pre> <p>HTML:</p> <pre><code>&lt;div id="topimg"&gt; &lt;/div&gt; </code></pre> <p>JAVASCRIPT:</p> <pre><code>$('#topimg').load(function() { $('#topimg').css({opacity: 0}).animate({opacity: 1}, {duration: 1500}); }); </code></pre>