Question

I have a hidden div tag that will be used for a running total of loaded images:

<div id="ImagesLoaded">0</div>

When an image page runs it loads 8 images, and every onload adds 1 to ‘ImagesLoaded’. Some images may be bigger than others, so the page load times can vary. When ‘ImagesLoaded’ is 8 I want to run a script to adjust my screen, which will be based on the sizing and orientation of the images.

What I want to know is this: how can I run a script in the background that checks every 100 milliseconds how many images I have loaded? When there 8 images, it should stop looking at the amount, and run another script.

Any ideas?

Answer 1

 onLoad = "addOneToImagesLoaded();"

and the js:

 function addOneToImagesLoaded(){
      current_count = parseInt(getElementById('ImagesLoaded').innerHTML);
      current_count = current_count+1;
      getElementById('ImagesLoaded').innerHTML = current_count.toString();
      if (current_count == 8){
           YOUR LOGIC GOES HERE
      }
 }