OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <head> | 2 <head> |
3 <style> | 3 <style> |
4 .composited { | 4 .composited { |
5 -webkit-transform: translatez(0); | 5 transform: translatez(0); |
6 } | 6 } |
7 | 7 |
8 .box { | 8 .box { |
9 width: 100px; | 9 width: 100px; |
10 height: 100px; | 10 height: 100px; |
11 } | 11 } |
12 | 12 |
13 .behind { | 13 .behind { |
14 position: absolute; | 14 position: absolute; |
15 z-index: 1; | 15 z-index: 1; |
(...skipping 21 matching lines...) Expand all Loading... |
37 .top { | 37 .top { |
38 position: absolute; | 38 position: absolute; |
39 z-index: 1; | 39 z-index: 1; |
40 top: 340px; | 40 top: 340px; |
41 left: 340px; | 41 left: 340px; |
42 background-color: cyan; | 42 background-color: cyan; |
43 } | 43 } |
44 | 44 |
45 div:hover { | 45 div:hover { |
46 background-color: green; | 46 background-color: green; |
47 -webkit-transform:translatez(0); | 47 transform:translatez(0); |
48 } | 48 } |
49 | 49 |
50 </style> | 50 </style> |
51 <script> | 51 <script> |
52 if (window.testRunner) | 52 if (window.testRunner) |
53 testRunner.dumpAsText(); | 53 testRunner.dumpAsText(); |
54 | 54 |
55 if (window.internals) | 55 if (window.internals) |
56 internals.settings.setLayerSquashingEnabled(true); | 56 internals.settings.setLayerSquashingEnabled(true); |
57 | 57 |
(...skipping 66 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
124 Case 3: hovering over the "middle2" element (causes that div to become its o
wn composited layer) | 124 Case 3: hovering over the "middle2" element (causes that div to become its o
wn composited layer) |
125 <pre id="Case3"></pre> | 125 <pre id="Case3"></pre> |
126 Case 4: hovering over the "top" element (causes that div to become its own c
omposited layer) | 126 Case 4: hovering over the "top" element (causes that div to become its own c
omposited layer) |
127 <pre id="Case4"></pre> | 127 <pre id="Case4"></pre> |
128 Case 5: back to situation in case 1 | 128 Case 5: back to situation in case 1 |
129 <pre id="Case5"></pre> | 129 <pre id="Case5"></pre> |
130 </div> | 130 </div> |
131 | 131 |
132 </body> | 132 </body> |
133 </body> | 133 </body> |
OLD | NEW |