| levin@chromium.org | 8de8c51 | 2009-02-28 01:28:46 +0000 | [diff] [blame] | 1 | <html> |
| 2 | <head> |
| 3 | <script> |
| 4 | function print(message) |
| 5 | { |
| 6 | var paragraph = document.createElement("p"); |
| 7 | paragraph.appendChild(document.createTextNode(message)); |
| 8 | document.getElementById("console").appendChild(paragraph); |
| 9 | } |
| 10 | function test() |
| 11 | { |
| rniwa@webkit.org | ada3c20 | 2012-06-20 03:28:42 +0000 | [diff] [blame] | 12 | if (window.testRunner) |
| 13 | testRunner.dumpAsText(); |
| levin@chromium.org | 8de8c51 | 2009-02-28 01:28:46 +0000 | [diff] [blame] | 14 | |
| 15 | var statik = document.getElementById('static'); |
| 16 | var relative = document.getElementById('relative'); |
| 17 | var firstFixed = document.getElementById('fixed1'); |
| 18 | var secondFixed = document.getElementById('fixed2'); |
| 19 | var body = document.body; |
| 20 | print("First Fixed offsetParent (null): "+firstFixed.offsetParent); |
| 21 | print("First Fixed offsetTop (10): "+firstFixed.offsetTop); |
| 22 | print("First Fixed offsetLeft (20): "+firstFixed.offsetLeft); |
| 23 | print("Second Fixed offsetParent (null): "+secondFixed.offsetParent); |
| 24 | print("Second Fixed offsetTop (15): "+secondFixed.offsetTop); |
| 25 | print("Second Fixed offsetLeft (30): "+secondFixed.offsetLeft); |
| 26 | print("Body offsetParent (null): "+body.offsetParent); |
| 27 | print("Body offsetTop (0): "+body.offsetTop); |
| 28 | print("Body offsetLeft (0): "+body.offsetLeft); |
| 29 | print("Static offsetParent ([object HTMLBodyElement]): "+statik.offsetParent); |
| 30 | print("Static offsetTop (15): "+statik.offsetTop); |
| 31 | print("Static offsetLeft (15): "+statik.offsetLeft); |
| 32 | print("Relative offsetParent ([object HTMLBodyElement]): "+relative.offsetParent); |
| 33 | print("Relative offsetTop (13): "+relative.offsetTop); |
| 34 | print("Relative offsetLeft (19): "+relative.offsetLeft); |
| 35 | } |
| 36 | </script> |
| 37 | </head> |
| 38 | <body onload="test()" style="margin:10px;border:5px solid white"> |
| 39 | <div id="static" style="border:1px solid green"></div> |
| 40 | <div id="relative" style="position:relative;top:-4px;left:4px;border:1px solid blue"></div> |
| 41 | <div id="fixed1" style="position:fixed;top:10px;left:20px;border:1px solid red"></div> |
| 42 | <div id="absolute" style="position:absolute"><div id="fixed2" style="position:fixed;top:15px;left:30px"></div></div> |
| 43 | <p>This test checks if <code>offsetParent</code> is always <code>null</code> when accessed from the HTML <code><body></code> and from elements with CSS property <code>position:fixed</code>. To ensure values match layout, this test also checks <code>offsetTop</code> and <code>offsetLeft</code>.</p> |
| 44 | <p>In addition to the HTML <code><body></code>, two elements with CSS property <code>position:fixed</code> are tested: One within the body, and one within an element with CSS property <code>position:absolute</code>.</p> |
| 45 | <p>Finally, a static- and relative-positioned element are tested for sanity and spec adherence.</p> |
| 46 | <p>Expected values are parenthesized. Test has passed if all values match.</p> |
| 47 | <hr> |
| 48 | <div id="console"></div> |
| 49 | </body> |
| 50 | </html> |
