René Nyffenegger's collection of things on the web
René Nyffenegger on Oracle - Most wanted - Feedback -
 

Preloading images with JavaScript

It is possible to check if an image is loaded with its complete method. However, apparently, this only works with Opera and MSIE. 
<html>
<head>
  <script language='JavaScript'>

    var array_images = new Array();

    array_images[0] = new Image();
    array_images[1] = new Image();
    array_images[2] = new Image();
    array_images[3] = new Image();

    array_images[0].src = 'img_0.jpg';
    array_images[1].src = 'img_1.jpg';
    array_images[2].src = 'img_2.jpg';
    array_images[3].src = 'img_3.jpg';

    function wait_all_images_loaded(array_images) {
      
      var yes_or_no = true;

      for (var i = 0; i < array_images.length; i++) {
         if (!array_images[i].complete) yes_or_no = false;
      }

      if (! yes_or_no) setTimeout('wait_all_images_loaded()', 250);

    }
  </script>

  </head>
  <body onLoad='wait_all_images_loaded()'>

  </body>
</head>