V
VK
To PointedEars with my deep respect.
Author ;-)
There were a question a while ago about events. Now I see that my
original explanation was not full. Check this sample out:
<html>
<head>
<title>Event test</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<script>
function test1() {
alert('MouseOut event detected');
}
function test2() {
if (window.event.toElement.tagName=='BODY') {
alert('MouseOut event detected');
}
}
</script>
<style type="text/css">
<!--
/* this to prevent ul's to take
the whole page width
so you could slip your mouse from the right */
ul { width: 10%}
-->
</style>
</head>
<body bgcolor="#FFFFFF">
<h4>Test Case 1</h4>
<ul onmouseout="test1()">
<li><a href="bogus1.html">Item 1</a></li>
<li><a href="bogus2.html">Item 2</a></li>
<li><a href="bogus3.html">Item 3</a></li>
</ul>
<h4>Test Case 2</h4>
<ul onmouseout="test2()">
<li><a href="bogus1.html">Item 1</a></li>
<li><a href="bogus2.html">Item 2</a></li>
<li><a href="bogus3.html">Item 3</a></li>
</ul>
</body>
</html>
Test Case 1 was made (as I stronly believe) in the way anyone would try
first to capture onMouseOut event from a list (function test1).
Nevertheless this test case doesn't work at all.
First of all, it gets a fountain of events not only from the <ul>, but
from all underlaying elements (<a>'s here) as well.
Secondly, it gets MOUSEOUT event in case of MOUSEOVER event: when mouse
enters to the <ul> area! The last nonsence took a cup of strong coffee
from me before I recalled the implemented "compatibility scheme". Now
events are simultaneously "bubbling" from the bottom to the top (IE
scheme) as well as "falling down" from the top to the bottom (broken
parts taken from NN4).
So when I move my mouse OVER the <ul>, I leaving the body area, and
this OUT event received by window (NN top-to-bottom scheme) is being
delivered down to the <ul>. It's getting crazy even reading this, is
not it?
Any way, test2() solves the problem by examining event's property, but
it uses IE proprietary properties.
Any semi-simple universal solution for this case?
Author ;-)
There were a question a while ago about events. Now I see that my
original explanation was not full. Check this sample out:
<html>
<head>
<title>Event test</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<script>
function test1() {
alert('MouseOut event detected');
}
function test2() {
if (window.event.toElement.tagName=='BODY') {
alert('MouseOut event detected');
}
}
</script>
<style type="text/css">
<!--
/* this to prevent ul's to take
the whole page width
so you could slip your mouse from the right */
ul { width: 10%}
-->
</style>
</head>
<body bgcolor="#FFFFFF">
<h4>Test Case 1</h4>
<ul onmouseout="test1()">
<li><a href="bogus1.html">Item 1</a></li>
<li><a href="bogus2.html">Item 2</a></li>
<li><a href="bogus3.html">Item 3</a></li>
</ul>
<h4>Test Case 2</h4>
<ul onmouseout="test2()">
<li><a href="bogus1.html">Item 1</a></li>
<li><a href="bogus2.html">Item 2</a></li>
<li><a href="bogus3.html">Item 3</a></li>
</ul>
</body>
</html>
Test Case 1 was made (as I stronly believe) in the way anyone would try
first to capture onMouseOut event from a list (function test1).
Nevertheless this test case doesn't work at all.
First of all, it gets a fountain of events not only from the <ul>, but
from all underlaying elements (<a>'s here) as well.
Secondly, it gets MOUSEOUT event in case of MOUSEOVER event: when mouse
enters to the <ul> area! The last nonsence took a cup of strong coffee
from me before I recalled the implemented "compatibility scheme". Now
events are simultaneously "bubbling" from the bottom to the top (IE
scheme) as well as "falling down" from the top to the bottom (broken
parts taken from NN4).
So when I move my mouse OVER the <ul>, I leaving the body area, and
this OUT event received by window (NN top-to-bottom scheme) is being
delivered down to the <ul>. It's getting crazy even reading this, is
not it?
Any way, test2() solves the problem by examining event's property, but
it uses IE proprietary properties.
Any semi-simple universal solution for this case?
experiments have