Simple javascript help

[aceofspades]

HELP!

Im trying to change a simple image rollover script so that it displays code rather than a new image. For example:

Before roll over: image1.jpg

After roll over <h1><img src="image2.jpg" />Test</h1>

Is this possible?

Regards,

James

--------------- Added [DATE]1202850179[/DATE] at [TIME]1202850179[/TIME] ---------------

This is what i have been trying to convert to replace an image with code, but the src function is tied into it and i cant get it to work.

http://joemaller.com/js-singleroll.shtml

[cheesegrits]

Well that code is very specifically about swapping images in and out on a roll-over, which is not what you want to do. What you'll need to do is wrap your IMG tag in a div, then set the innerHTML property as you roll in and out.

So the div would look something like this:

<div id="myimage"><img src="image2.jpg"></div>

You can keep the basic structure of the functions in the example you are looking out - the mouseOver and mouseOut functions, but get rid of all the stuff about creating new Image elements.

Then in your mouseOver function, just do something like this:

document.getElementById('myimage').innerHTML = '<img src="image2.jpg"><h1>Test</h1>';

And in your mouseOut function:

document.getElementById('myimage').innerHTML = '<img src="image2.jpg">';

-- hugh