How to preload a <span> background?

[privateer]

Having preloaded an image, does anyone know how to use the preloaded image to replace the background image of a span?

Specifically:
1. A <span> has a background of: a.gif

2. b.gif has been preloaded into js object: imgB (holds b.gif
and the path to b.gif is images/b.gif)

3. Now we need to replace the background of the <span> with imgB without causing the browser to simply reload it from the server (say on a mouse over event).

The code fragment:
<spanid>.style.backgroundImage = "url(images/b.gif)";
will load it from the server.

<spanid>.style.backgroundImage = "url(" + imgB.src + ")";
will also load the image

However, since the style backgroundImage attribute does not accept an image object as an argument and you must pass it the URL from the source attribute of the image object;

Is the preloaded image used or is the image simply requested again from the server?

Thanks

[redhead]

to preload an image you could use this... (i think it is correct...)

<script>
var image1 = new Image();
image1.src = "spanBbackground.gif";
</script>

it will download the image before getting on with the code after it....

hope that helps...

[privateer]

redhead,

Thanks for your input. The code you mention is what I used to preload the image to the browser. Preloading the image into a js image object is working fine.

My question is regarding using the preloaded image to replace the background image of a <span> tag given that you cannot simply pass the image object, you must pass the URL of the image object.

Any thoughts?

Thanks

[Roy Sinclair]

If the browser is working it's cache properly then preloading the image will also make it available for use later as a background.