OLD | NEW |
| (Empty) |
1 <html> | |
2 <head> | |
3 <title>Reduction</title> | |
4 <style> | |
5 #content-container { | |
6 position:absolute; | |
7 top:48px; | |
8 bottom:0; | |
9 left:0; | |
10 right:0; | |
11 margin-left:225px; | |
12 } | |
13 | |
14 #composited { | |
15 height: 38px; | |
16 transform:translate3d(0px, 0px, 0px); | |
17 } | |
18 | |
19 #positioned-2 { | |
20 position:absolute; | |
21 top:40px; | |
22 bottom:0; | |
23 left:0; | |
24 right:0; | |
25 } | |
26 | |
27 .positioned-3 { | |
28 position:absolute; | |
29 top:0; | |
30 bottom:0; | |
31 left:0; | |
32 right:0; | |
33 } | |
34 | |
35 #transformed-container { | |
36 transform: translateX(0); | |
37 height:300px; | |
38 width:600px; | |
39 } | |
40 | |
41 #overflow { | |
42 overflow:auto; | |
43 border: 2px solid black; | |
44 } | |
45 | |
46 .positioned-4 { | |
47 position:absolute; | |
48 top:20px; | |
49 height:80px; | |
50 right:20px; | |
51 width:80px; | |
52 } | |
53 </style> | |
54 </head> | |
55 | |
56 <script src="../../resources/run-after-layout-and-paint.js"></script> | |
57 | |
58 <script> | |
59 if (window.testRunner) { | |
60 testRunner.dumpAsTextWithPixelResults(); | |
61 testRunner.waitUntilDone(); | |
62 } | |
63 | |
64 function repaintTest() { | |
65 runAfterLayoutAndPaint(function() { | |
66 document.getElementById('overflow').scrollTop = 30; | |
67 runAfterLayoutAndPaint(function() { | |
68 document.getElementById('overflow').scrollTop = 50; | |
69 testRunner.notifyDone(); | |
70 }); | |
71 }); | |
72 } | |
73 | |
74 </script> | |
75 | |
76 <body onload="repaintTest()"> | |
77 <div id="content-container"> | |
78 <div id="composited"></div> | |
79 <div id="positioned-2"> | |
80 <div id="transformed-container" class="positioned-3"> | |
81 <div id="overflow" class="positioned-3"> | |
82 <div class="positioned-4"></div> | |
83 | |
84 <div style="background-color:purple; width:50px; height:300p
x;"></div> | |
85 <br/> | |
86 <div style="width:500px; height:50px; background-color:green
;"></div> | |
87 </div> | |
88 </div> | |
89 </div> | |
90 </div> | |
91 </body> | |
92 </html> | |
OLD | NEW |