how to change text in another part of the page while hover on link

[lli2k5]

I'm trying to change text in another part of the page by hovering on a hyperlink.

Basically, if the mouse hovers on a select hyperlink text, different text is going to be displayed in another div. If it hovers on link1, text is displayed in a div. If it hovers on link2, different text is displayed in that div. If it hovers back on link1, the original text in that div is being displayed.

What kind of scripting techniques do I need to use in order to do this?

Are there any examples of this technique?

[lli2k5]

The examples that I've found online only allow you to do simple text replacements in the div.

I'm trying to find a way to freely change images and hyperlinks in a div, when the mouse hovers on a link. Also, is there a way to not require the changed text to be in a separate script?

[tedster]

It definitely takes dhtml -- javascript plus css.

One approach is to use different divs with absolute positioning in the same screen position. Set all but the first "state" to be visibility:hidden -- and then use the onmouseover event to change the css visibility rules for the divs.

It would be a variety of the basic show/hide divs scripting that is widely used for menus, but all the divs would be in exactly the same position instead of staggered the way they are for drop-down or fly-out menus.

By doing it this way, all the text would be in divs with ids, and not inside script elements.

[lli2k5]

I checked with that and the problem is if the user wants to zoom in or zoom out, the div would remain absolute and not inline with text.