Hover text - CSS?

[JohnK]

Hi,

I have some links that I would like to display explanatory text when the user hovers over. I know I can use alt text or tooltips so that the text appears but I would like it to appear in a separate box (some of the text is quite long and not really suitable for the regular tooltip. When the user stops hovering the text should disappear again.

Is it possible to do this using pure css or does it involve javascript?

Thanks in advance for any help.


John

[thetestingsite]

Not using pure css (that I'm aware of), but you could try using these Javascripts:

http://www.dynamicdrive.com/dynamicindex5/linkinfo.htm
http://www.dynamicdrive.com/dynamicindex5/linkinfo2.htm

Hope this helps.

[auntnini]

I think inspiration may lie somewhre in these sources:
http://www.webreference.com/programming/css_style/index.html
http://www.alistapart.com/articles/cssmaps/
http://www.dynamicdrive.com/style/csslibrary/item/css-image-gallery/#thumb

A <dl> definition list can have numerous <dt> definition term each <dt> can have more than one <dd> definition data/description.

Couldn't one of the <dd>'s (with a chunk on text) be styled with the CSS hover/span methodolgy?

a a:visited { position: RELATIVE; display: block; }
a SPAN { display: NONE; }
a:HOVER span { display: BLOCK; position: ABSOLUTE; [... etc ...] }

I myself am having an IE/Win problem with DD's CSS-imaage-gallery at http://chanit.com/gallery/index.html and am therefore in the midst of trying some such thing.