How can I preload images?

<script type="text/javascript">
    if (document.images) //This line checks if the document.images object exist (coz' older browsers wont support it)
    {
      preload_images = new Image();
      img = new Array();
      img[0] = "highres01.jpg";
      img[1] = "highres02.jpg";
      img[2] = "highres03.jpg";
      var i = 0;
      for(i=0; i<pics.length; i++)  
         {preload_images.src = img[i];}
    }
</script>

<img id="img1" />

<span onmouseover="document.getElementById('img1').src='highres01.jpg';">
change pic1</span>