title: How to monitor an image source for fully loaded status
body: <p>I am loading a large number of images into a dynamic DIV and I am using a preloader to get the images.</p>
  
  <pre><code>imageObj = new Image();
  imageObj.src = imgpath + imgname;
  </code></pre>
  
  <p>Each of these events creates a GET that I can see and monitor in Firebug.</p>
  
  <p>If I know the name and path of an image, can I watch the relevant XMLHttpRequest to see if the GET has completed?</p>
  
  <p>I do not want to rely on (or use) .onload events for this process.</p>
  
  <p>The pseudo would look something like this...</p>
  
  <pre><code>if (imageObj.GET = 'complete')
  </code></pre>
  
  <p>Has anyone had any experience of this? </p>
  
  <p><strong>EDIT 1</strong></p>
  
  <p>Thanks to the help from Bart (see below) I have changed my image preloader to store an array of the image objects...</p>
  
  <pre><code>function imagePreLoader(imgname) {
      images[imgnum] = new Image();
      images[imgnum].src = imgpath + imgname;// load the image
      imgnum ++;
  }
  </code></pre>
  
  <p>And then, after all my other functions have run to build the content DIVs, I used the image.complete attribute in the following...</p>
  
  <pre><code>var interval = setInterval(function () {
      imgcount = imgnum - 1; // because the imgnum counter ++ after src is called.
      ok = 1;
  
      for (i=0; i&lt;imgcount; i++) {
          if (images[i].complete == false){
              ok = 0;
          }
      }
  
      if (ok == 1) {
          clearInterval(interval);
          showIndexOnLoad();
      }
  }, 1000);
  </code></pre>
  
  <p>This waits until all the images are complete and only triggers the <code>showIndexOnLoad()</code> function when I get the 'ok' from the interval function.</p>
  
  <p>All images now appear as I wanted, all at once with no additional waits for the GETs to catch up.</p>
  
  <p>Well done Bart for putting me on to the <a href="http://www.w3schools.com/jsref/prop_img_complete.asp" rel="nofollow">image.complete</a> attribute.</p>