JavaScript preloading …?

I have the following code:

<script language="JavaScript1.2">
if (ie4||dom)
{
    document.write('<div style="position:relative;width:'+(scroller_width+10)+';height:'+scroller_height+';overflow:hidden"><div id="canvas0" style="position:absolute; background: url(\'img/bk_industrynews.jpg\'); background-color:'+bgcolor+';width:'+scroller_width+';height:'+scroller_height+';top:'+scroller_height+';filter:alpha(opacity=20);-moz-opacity:0.2;"></div><div id="canvas1" style="position:absolute; background: url(\'img/bk_industrynews.jpg\'); background-color:'+bgcolor+';width:'+scroller_width+';height:'+scroller_height+';top:'+scroller_height+';filter:alpha(opacity=20);-moz-opacity:0.2;"></div></div>')
} else if (document.layers)
{
    document.write('<ilayer id=tickernsmain visibility=hide width='+scroller_width+' height='+scroller_height+' background: url(\'img/bk_industrynews.jpg\'); bgColor='+bgcolor+'><layer id=tickernssub width='+scroller_width+' height='+scroller_height+' left=0 top=0>'+scrollercontent[0]+'</layer></ilayer>')
}
</script>

Code (markup):

How can I preload ‘img/bk_industrynews.jpg’? This code works fine in Firefox, but IE6 keeps loading this image over and over. And thus, this page doesn’t work well.

 

Try this:

<script type="text/javascript">
var myImage = new Image();
myImage.src = "img/bk_industrynews.jpg";
if (ie4||dom)
{
  ...
}
</script>

Code (markup):

 

Nope. This doesn't really change anything.

I guess I need to use this preloaded image somehow, but I cannot figure out how ...