Swap multiple images on "hover over TEXT"

Hello,
I am trying to do an image swap when hovering over "TEXT" links.
For instance, I would like to first have a "mainpic" in a div that would be replaced by either image 1,2 or 3 (depending on if you are hovering over"text link 1,2 or 3).

I would use normal rollover "image" swaps, but would prefer to have the "trigger" to be "text" (for SEO reasons).

I am just getting familiar with javascript, but do not even know where to begin!
I have read multiple forum entries throught google, but could not find any where I could have "multiple" text links.

I would so much appreciate it if anyone could please point me in a direction. Sincerely, Buffmin

Try this:-

<img id = "myImage" src = "default.jpg">
<br><br>

<a href = javascript:void(0); onmouseover = "document.getElementById('myImage').src = 'One.jpg' ">Link one</a> &nbsp &nbsp

<a href = javascript:void(0); onmouseover = "document.getElementById('myImage').src = 'Two.jpg' ">Link two</a> &nbsp &nbsp

<a href = javascript:void(0); onmouseover = "document.getElementById('myImage').src = 'Three.jpg' ">Link three</a>

You can add onmouseout if you wish to revert to the default.


All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

Thank you Philip.
Looking easy. Now I assume I have to add some type of getelementById script code in the head section? Sorry, I am new to javascript.

Thank you Philip.
Looking easy. Now I assume I have to add some type of getelementById script code in the head section? Sorry, I am new to javascript.

No. Why? The code is complete.

Philip,
You are correct! Thank you very much! Buffmin :thumbsup: