Mouse events within a DIV layer and Netscape/Mozilla

Jean-Gael GRICOURT · Nov 2, 2003

I am trying to capture mouse events when entering and leaving a DIV
layer. This test code works fine with IE 6.0 and Opera 7.21 but fails
with Mozilla/Netscape. The strange thing is that the mouse events
respond continuously whenever the mouse is moving inside the DIV area.

Does anybody have a clue about what is happenning ?

J2G

==== TEST CODE ====

<html>
<head>
<script type=text/javascript>
function show() {
nbIn=0;
nbOut=0;
document.getElementById('AREA').style.visibility = 'visible';
}

function areaIn() {
nbIn++;
window.status = "out: " + nbOut + " in: " + nbIn;
}

function areaOut() {
nbOut++;
window.status = "out: " + nbOut + " in: " + nbIn;
}

</script>
</head>
<body>

<a href="javascript:show()">SHOW DIV</a>
<p>

<div id="AREA" size=5 style="visibility: hidden"
onmouseover="javascript:areaIn()" onmouseout="javascript:areaOut()">
<select size=5>
<option>value01
<option>value02
<option>value03
<option>value04
<option>value05
<option>value06
</select>
</div>

</body>
</html>

Martin Honnen · Nov 2, 2003

Jean-Gael GRICOURT said:
I am trying to capture mouse events when entering and leaving a DIV
layer. This test code works fine with IE 6.0 and Opera 7.21 but fails
with Mozilla/Netscape. The strange thing is that the mouse events
respond continuously whenever the mouse is moving inside the DIV area.

Does anybody have a clue about what is happenning ?

Yes, the events mouseout/mouseover fire whenever the mouse moves
over/out any element, your div has a child element, the <select>, which
has child elements, the <option> elements, and when you move your mouse
over the select element then mouseout for the <div> is fired and
mouseover for the <select>. And events bubble, so any events happening
on the <select> or the <option> bubble up to the <div> and fire your
onmouseover/onmouseout handler. See
http://www.faqts.com/knowledge_base/view.phtml/aid/1606/fid/145
for a solution.

Help with Visual Lightbox: Scripts	2	May 3, 2023
Survey details won't go through using php, ajax, Mysql	0	Oct 26, 2023
Need Help, Both submit button works same, i need both submit button works differently, the one button override other button	3	Nov 9, 2022
Key events in invisible (by -Moz-Opacity) div (Mozilla)	2	Aug 1, 2006
Multi select options in a menu	1	Oct 30, 2022
Fading effect between play and play-over and pause and pause-over	0	Oct 16, 2021
Bottom DIV handles events from top DIV layers only in IE6,7	4	Dec 21, 2008
I Need Help with making a function that draws in a canvas using location data.	1	Dec 17, 2021

Mouse events within a DIV layer and Netscape/Mozilla

Jean-Gael GRICOURT

Martin Honnen

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads