Show ajax loader image until an actual image is loaded
<p>So I have a page with little picture thumbnails on it and one big area in the middle of the page for full size photo.</p>

<p>When user clicks on a thumbnail, a full size picture is shown in the middle of the page. I just change the src attribute of the image in the middle like this to achieve that:</p>

<pre><code>$('img#fullsize').attr('src', path); // path is built earlier in the jQuery code
</code></pre>

<p>The problem is that when the fullsize image is too large what it does is that the fullsize image in the middle disappears and nothing is there until the new full size image starts loading (and sometimes it can take cca 5 seconds until new image starts loading during peak hours). What I would like is to show an ajax loader gif image until the fullsize photo starts loading. How can I do that?</p>

<p>Thanks.</p>
