2009-07-01 Simon Fraser <simon.fraser@apple.com>
[WebKit-https.git] / LayoutTests / compositing / geometry / root-layer-update.html
1 <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-GB">
2 <!-- =========================================== kroc camen of camen design ============================================= -->
3 <head>
4   <title>camen design - Video for Everybody!</title>
5   <style type="text/css" media="screen">
6     body {
7       width: 600px;
8       margin: 0 auto;
9     }
10
11     #sidebar {
12       position: absolute;
13       height: 100px;
14       width: 100px; 
15       margin-left: -200px;
16       padding-left: 200px;
17       background: gray;
18     }
19
20     #article {
21       position: relative;
22       border: 1px solid black;
23     }
24
25     #compositing {
26       height: 100px;
27       width: 100px;
28       background-color: green;
29       margin: 0 auto;
30       -webkit-transform: translateZ(0);
31     }
32     
33     #tester {
34       position: absolute;
35       top: 1px;
36       left: 350px;
37       height: 100px;
38       width: 100px;
39       background-color: red;
40     }
41   </style>
42   <script type="text/javascript" charset="utf-8">
43   if (window.layoutTestController)
44     layoutTestController.waitUntilDone();
45
46   function startTest()
47   {
48     window.setTimeout(function() {
49       document.documentElement.style.width = '800px'
50       window.setTimeout(function() {
51         if (window.layoutTestController)
52           layoutTestController.notifyDone();
53       }, 0);
54     }, 0);
55   }
56
57   window.addEventListener('load', startTest, false);
58   </script>
59 </head>
60 <body>
61
62   <div id="tester"></div>
63   <div id="sidebar"></div>
64
65   <div id="article">
66     <div id="compositing"></div>
67   </div>
68   <p><a href="rdar://problem/7026010">rdar://problem/7026010</a><br>
69     Test for the root layer getting correctly positioned. You should see no red.</p>
70 </body>
71 </html>