| <!DOCTYPE html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <style> |
| #left { |
| float: left; |
| width: 500px; |
| background: rgba(200, 200, 200, 0.8); |
| margin-right: -100px; |
| } |
| #left:hover { |
| background: rgb(200, 200, 200); |
| } |
| #right { |
| float: right; |
| width: 400px; |
| background-color: rgba(0, 128, 0, 0.8); |
| padding-bottom: 1px; |
| } |
| #right:hover { |
| background: rgb(0, 128, 0); |
| } |
| </style> |
| <div style="width: 800px;"> |
| <div id="left">foo</div> |
| <div id="right">bar</div> |
| <div style="height:0px; width:0px; clear:left;"></div> |
| </div> |
| <div id="log"></div> |
| <script> |
| test(function(t) |
| { |
| var rightElement = document.getElementById("right"); |
| var x = rightElement.offsetLeft + 10; |
| var y = rightElement.offsetTop + rightElement.offsetHeight / 2; |
| |
| var element = document.elementFromPoint(x, y); |
| assert_equals(element.nodeName, 'DIV'); |
| assert_equals(element.id, 'right'); |
| }, "elementFromPoint should return the topmost floating element when two floats overlap"); |
| </script> |