JavaScript preloading …?

[cre8ive]

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>

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.

[ajsa52]

Try this:


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

[cre8ive]

Try this:


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


Nope. This doesn't really change anything.

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