Am working with a web artist on a redesign of my site. I asked him if he thought a certain mouseover effect possible, and he replied "if you can find a Web page that does it, send me the URL." Now, I can't remember ever seeing it done, which is why I had my doubts in the first place. Before abandoning the idea altogether, I thought I'd run it by you guys & see whether you know it to be possible.

I have illustrated the effect in two sketches, one showing the pre-mouseover state, one during mouseover. They are on my website at http://www.shinyheadgraphics.com/mouseoverquestion.htm/

As I imagine the redesign, at the top of each page will be a few lines of text inviting the viewer to browse similar pages. When mousing over these lines, a menu will drop down, listing links to specific pages. At the same time, all other elements of the page, including graphics, move down to make room for the drop-down menu. This is the part that I'm not sure can be done. I've tried alternate designs where the drop-down menu overlaps the elements below (which I know can be done), but I'm much less happy with those designs.

If you have ever seen this effect done before, or otherwise know it to be doable, please let me know. Thank you!

Hi.
This fairly easy and can be done without much of JS. All you need is CSS.

You insert the attribute "visibility:hidden" into the part that is supposed to popout on mouseover.
All you need is the following line:

onmouseover=document.getElementById("ID of the supposed popout").style.visibility = "visible";

onmouseout=document.getElementById("the same ID again").style.visibility = "hidden";

The text beneath will be moved down automatically.
Mfg,
c2k

Will forward your reply to my designer & see if we can get these pages looking and acting like I envision.

Thanks again, c2k, for your reply. My designer has a few questions, though. Posting the following on his behalf:

We were wondering what sort of element to place in the table containing
the text and graphics to assign this script to, for example, div, span,
or a table? Also, any ideas on which browsers do or don't support
this? Below this would be not only text but some rather large graphic
files. We can see how this script will toggle visibility, but it's
hard to envision how the text and graphic files will be pushed down.
If you have the URL of any page employing this technique, would be
greatly appreciated to see how it works and be sure we are talking
about same thing.
Aloha