mouseleave.relatedTarget.html (1991B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title id='desc'> MouseEvent.relatedTarget for mouseleave Event </title> 5 <script type="text/javascript"> 6 var PassTest = function() 7 { 8 document.getElementById("testresult").firstChild.data = "PASS"; 9 } 10 11 var FailTest = function() 12 { 13 document.getElementById("testresult").firstChild.data = "FAIL"; 14 } 15 16 var EVENT = "mouseleave"; 17 var TARGET, PARENT; 18 19 window.onload = function(e) 20 { 21 try 22 { 23 TARGET = document.getElementById("target"); 24 PARENT = document.getElementById("parent"); 25 TARGET.addEventListener(EVENT, TestEvent, true); 26 } 27 catch(ex) 28 { 29 FailTest(); 30 } 31 } 32 33 function TestEvent(evt) 34 { 35 if (evt.type == EVENT && evt.relatedTarget == PARENT) 36 { 37 PassTest(); 38 } 39 else 40 { 41 FailTest(); 42 } 43 } 44 </script> 45 </head> 46 <body> 47 <h3>DOM Events</h3> 48 <h4> 49 Test Description: MouseEvent.relatedTarget for mouseleave event indicates 50 the event target a pointing device is entering, if any. 51 </h4> 52 53 <pre> 54 <div id="parent" style="border:solid 1px green; width:350px; height:100px;"> 55 56 <button id="target">BUTTON</button> 57 58 </div> 59 60 Steps: 61 1) Move the mouse pointer onto the above button 62 2) Then move the mouse pointer out of it 63 </pre> 64 65 <p>Test passes if the word "PASS" appears below after following the above steps.</p> 66 <div>Test result: </div> 67 <div id='testresult'>FAIL</div> 68 </body> 69 </html>