OLD | NEW |
---|---|
(Empty) | |
1 <!DOCTYPE html> | |
2 <head> | |
3 <style> | |
4 .composited { | |
5 -webkit-transform: translatez(0); | |
6 } | |
7 | |
8 .box { | |
9 width: 100px; | |
10 height: 100px; | |
11 } | |
12 | |
13 .behind { | |
14 position: absolute; | |
15 z-index: 1; | |
16 top: 100px; | |
17 left: 100px; | |
18 background-color: blue; | |
19 } | |
20 | |
21 .middle { | |
22 position: absolute; | |
23 z-index: 1; | |
24 top: 40px; | |
25 left: 40px; | |
26 background-color: lime; | |
27 } | |
28 | |
29 .middle2 { | |
30 position: absolute; | |
31 z-index: 1; | |
32 top: 130px; | |
33 left: 60px; | |
34 background-color: magenta; | |
35 } | |
36 | |
37 .top { | |
38 position: absolute; | |
39 z-index: 1; | |
40 top: 70px; | |
41 left: 120px; | |
42 background-color: cyan; | |
43 } | |
44 | |
45 .container { | |
46 position: absolute; | |
47 z-index: 1; | |
48 top: 25px; | |
49 left: 25px; | |
50 width: 300px; | |
51 height: 300px; | |
52 background-color: gray; | |
53 overflow: hidden; | |
54 } | |
55 | |
56 div:hover { | |
57 background-color: green; | |
58 } | |
59 | |
60 </style> | |
61 <script> | |
62 if (window.testRunner) | |
63 testRunner.dumpAsText(); | |
64 | |
65 if (window.internals) | |
66 internals.settings.setLayerSquashingEnabled(true); | |
67 | |
68 function runTest() | |
69 { | |
70 if (!window.internals) { | |
71 alert('This test requires window.internals') | |
72 return; | |
73 } | |
74 | |
75 testRunner.display(); | |
76 document.body.textContent = window.internals.layerTreeAsText(document, i nternals.LAYER_TREE_INCLUDES_REPAINT_RECTS); | |
77 document.body.style.whiteSpace = 'pre'; | |
78 } | |
79 </script> | |
80 </head> | |
81 <body onload="runTest()"> | |
82 <div class="container"> | |
83 <div class="composited box behind"></div> | |
shawnsingh
2014/01/27 21:35:27
Actually my manual test for this was outdated, sor
| |
84 </div> | |
85 <div class="box middle"></div> | |
86 <div class="box middle2"></div> | |
87 <div class="box top"></div> | |
88 </body> | |
OLD | NEW |