| <!DOCTYPE html> |
| <html id=html> |
| <head> |
| <script> |
| function log(message) { |
| document.getElementById('console').innerHTML += (message + "\n"); |
| } |
| |
| function logMouseEvent(ev) { |
| var target = (ev.target)? ev.target : ev.srcElement; |
| log(ev.type + " on " + target.id); |
| event.stopPropagation(); |
| } |
| |
| function doTest() { |
| document.body.offsetLeft; |
| document.body.addEventListener('mouseenter',logMouseEvent,true); |
| document.body.addEventListener('mouseleave',logMouseEvent,true); |
| if (window.testRunner) { |
| log("mouseMoveTo(1, 1)"); |
| eventSender.mouseMoveTo(1, 1); |
| log("<br>mouseMoveTo(90,140)"); |
| eventSender.mouseMoveTo(90,140); |
| log("<br>mouseMoveTo(110,140)"); |
| eventSender.mouseMoveTo(110,140); |
| log("<br>mouseMoveTo(130,140)"); |
| eventSender.mouseMoveTo(130,140); |
| log("<br>mouseMoveTo(170,140)"); |
| eventSender.mouseMoveTo(170,140); |
| log("<br>mouseMoveTo(180,140)"); |
| eventSender.mouseMoveTo(180,140); |
| log("<br>mouseMoveTo(210,140)"); |
| eventSender.mouseMoveTo(210,140); |
| |
| testRunner.dumpAsText(); |
| } |
| } |
| |
| document.addEventListener("DOMContentLoaded", function(event) { |
| var mouseTargets = document.querySelectorAll('[id]'); |
| for (var i = 0; i < mouseTargets.length; ++i) { |
| var target = mouseTargets[i]; |
| target.addEventListener('mouseover', logMouseEvent); |
| target.addEventListener('mouseout', logMouseEvent); |
| target.addEventListener('mousemove', logMouseEvent); |
| } |
| doTest(); |
| }); |
| |
| </script> |
| </head> |
| <body id=body> |
| <div id="outer1" style="width:100px; height:100px; background-color:blue; top:100px; left:100px; position:absolute"> |
| <div id="inner1" style="width:50px; height:50px; background-color:red; top:20px; left:20px; position:absolute"> |
| </div> |
| <div id="inner2" style="width:20px; height:20px; background-color:yellow; top:30px; left:60px; position:absolute"> |
| <div id="inner3" style="margin:5px; width:10px; height:10px; background-color:green;"> |
| </div> |
| </div> |
| </div> |
| <pre id="console"></pre> |
| </body> |
| </html> |