Forum Moderators: open

Message Too Old, No Replies

Nested Divs prematurely triggering scripts

         

Perfect Member Name

7:53 pm on Mar 4, 2004 (gmt 0)

10+ Year Member



I find this to be quite perplexing. This works just find in IE, but in any Mozilla/Netscape variant, there's a problem. Here's the setup:

In the head:

<script> 
function saySomething() {
alert('something');
}
</script>

In the body:

<div onmouseout="saySomething();"> 
<div>Test 1</div>
<div>Test 2</div>
<div>Test 3</div>
<div>Test 4</div>
<div>Test 5</div>
</div>

I want to be able to mouse between the "Test" divs and once I finally move out of the bounds of all of them, I want to trigger the saySomething() script. However, in Netscape/Mozilla, it appears that when mousing into one of the "Test" divs, the browser thinks that you've left the containing div and triggers the script.

Can anyone think of a way that I could do this? The actual application is a dynamic menu. These "Test" divs are navigation elements. When you mouse away from the entire menu, a script will trigger to hide the menu.

Thanks.

isitreal

9:12 pm on Mar 5, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



The common drop menu solution I see and am using makes the menu invisible on mouseoff, visible onmouseover.

Since this happens too fast for the user to see, just make each div element have that behavior, have the script make them all visible on mouseover, each would need it's own id, then when your mouse is no longer over any of them, the main menu block will disappear, since the script makes them all invisible on mouseoff, unless you wanted it to be visible first, then you'd have to set that in CSS, the css would then be overridden by the javascript.

There might be a more elegant solution out there, but I got the same results you got in IE 5.5 too, it didn't work on any browser I tested it in.

isitreal

4:33 pm on Mar 6, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I just thought of this, just get rid of the divs that hold the links completely, declare the a nav links as display block, then I think that div overrride thing might not happen at all. Remember that when you make a display block, it is a block, so you don't need to put it in another block unless you really need that for display purposes or something.