css background image change.

Hello Peeps.

I hope someone can advice me on this one.

I would like to be able to change the background image of a span through a mouseover link somewhere else on the page ie.


<span style="background:url('images/imagehere.gif') no-repeat;">content here</span>
<br /><br />
<a href="#">Change Background</a>


I have looked everywhere and have found plenty of mouseover scripts but not to replace something somewhere else on the page.

Really hope you can help.

Thank you if you can.

Lee

Give your span an id, then:


<a href="javascript:document.getElementById('THE_ID').style.backgroundImage='NEW_IMAGE_PATH'">Change Background</a>


Inline JS isn't the best way to do it. Search around to find a better way.

Onmouseout would you want the background image go back to its original image? If so then you don't need javascript.

Hello Chaps.

thanks for the reply's.

Yes I would like it go back to the origional backround on mouseout.

Hope you an advise.

Lee

Check out these examples: http://bonrouge.com/cheerspics.php
Tutorial here: http://bonrouge.com/~auto-gallery. Can be made to be used without php but if you have php available to you then you might as well use it.

Thanks for that but its not going to work for me.

As there will be content in the span.

It would be alot easier being able to use some form of javascript.

Hope someone can advise.

Lee