glorified disjointed rollovers

Hi everyone, this is my first post on this forum and is also my first attempt to use javascript. When it comes to javascript I am a complete noob, but before you push the back button I just thought I’d let you know I just spent a few hours in some javascript tuts so I could *at least* have some idea of what you and I are talking about.

Ok, here’s my question: How can I make a disjointed div become and [I]remain[/I] visible when I hover over it’s parent div? The only time I want that div to go back to being invisible is when I hover over another parent div causing it’s child div to become visible.

Here’s the example (only tested in FF 3.5.2) :

[url]www.e-uphoria.com/demo_two.html[/url]

I used :hover in css to show the disjointed div (the red box) that I want to become visible via javascript.

I managed to achieve this effect with css, but when the user moves the mouse out of the browser window the div disappears because the hover is no longer activated. This is why I need javascript, so the user can do anything he or she wants outside of the browser window and the “hover” will still be activated revealing the content of the div.

Here’s the example of the css only version (again, only tested in FF 3.5.2) :

[url]www.e-uphoria.com/demo.html[/url]

I messed around with some onmouseover and onmouseoff within the html and realized I could achieve the desired effect with some really messy and inefficient code. I would prefer to have the javascript in an external file and not looking like it was written by an idiot.

If anybody could help me out with this that would be awesomely awesome. Thanks!

?

Also in #JavaScript _↴