LayoutTests/fast/events/related-target.html

   1 <html>
   2 <head>
   3 <script>
   4
   5 function out(event)
   6 {
   7     var m = document.getElementById("m1");
   8     while (m.firstChild)
   9         m.removeChild(m.firstChild);
  10     m.appendChild(document.createTextNode("Moved out of "
  11         + event.target.getAttribute("id") + " to "
  12         + event.relatedTarget.getAttribute("id") + "."));
  13 }
  14
  15 function over(event)
  16 {
  17     var m = document.getElementById("m2");
  18     while (m.firstChild)
  19         m.removeChild(m.firstChild);
  20     m.appendChild(document.createTextNode("Moved over "
  21         + event.target.getAttribute("id") + " from "
  22         + event.relatedTarget.getAttribute("id") + "."));
  23
  24     if (window.layoutTestController)
  25         layoutTestController.notifyDone();
  26 }
  27
  28 function test()
  29 {
  30     if (window.layoutTestController)
  31         layoutTestController.dumpAsText();
  32
  33     if (window.eventSender) {
  34         eventSender.mouseMoveTo(50, 50);
  35         eventSender.mouseDown();
  36         eventSender.mouseUp();
  37         eventSender.mouseMoveTo(50, 150);
  38         eventSender.mouseDown();
  39         eventSender.mouseUp();
  40     }
  41 }
  42
  43 </script>
  44 </head>
  45 <body onload="test()">
  46 <div>
  47 <div id="A" style="background-color: red; width:100px; height:100px" onmouseout="out(event)"></div>
  48 <div id="B" style="background-color: blue; width:100px; height:100px" onmouseover="over(event)"></div>
  49 </div>
  50 <p>This test checks that the relatedTarget property is set on mouse out and mouse over events.</p>
  51 <p>To perform the test, move the mouse into the red box, and then drag it out of the red box into the blue box.</p>
  52 <p>The text below should say "Moved out of A to B. Moved over B from A."</p>
  53 <span id="m1"></span> <span id="m2"></span>
  54 </body>
  55 </html>