OLD | NEW |
(Empty) | |
| 1 CASE 1, original layer tree |
| 2 { |
| 3 "layers": [ |
| 4 { |
| 5 "name": "LayoutView #document", |
| 6 "bounds": [800, 600], |
| 7 "contentsOpaque": true, |
| 8 "drawsContent": true |
| 9 }, |
| 10 { |
| 11 "name": "LayoutBlockFlow (positioned) DIV class='composited box behind'", |
| 12 "position": [100, 100], |
| 13 "bounds": [100, 100], |
| 14 "contentsOpaque": true, |
| 15 "drawsContent": true, |
| 16 "backgroundColor": "#0000FF" |
| 17 }, |
| 18 { |
| 19 "name": "Squashing Containment Layer", |
| 20 "shouldFlattenTransform": false |
| 21 }, |
| 22 { |
| 23 "name": "LayoutBlockFlow (positioned) DIV class='box middle'", |
| 24 "position": [20, 20], |
| 25 "bounds": [100, 100], |
| 26 "contentsOpaque": true, |
| 27 "drawsContent": true, |
| 28 "backgroundColor": "#00FF00", |
| 29 "transform": [ |
| 30 [0.707106781186548, 0.707106781186548, 0, 0], |
| 31 [-0.707106781186548, 0.707106781186548, 0, 0], |
| 32 [0, 0, 1, 0], |
| 33 [0, 0, 0, 1] |
| 34 ] |
| 35 }, |
| 36 { |
| 37 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (positione
d) DIV class='box top')", |
| 38 "position": [180, 180], |
| 39 "bounds": [100, 100], |
| 40 "drawsContent": true |
| 41 } |
| 42 ] |
| 43 } |
| 44 CASE 2, hovering over the outer div |
| 45 { |
| 46 "layers": [ |
| 47 { |
| 48 "name": "LayoutView #document", |
| 49 "bounds": [800, 600], |
| 50 "contentsOpaque": true, |
| 51 "drawsContent": true |
| 52 }, |
| 53 { |
| 54 "name": "LayoutBlockFlow (positioned) DIV class='composited box behind'", |
| 55 "position": [100, 100], |
| 56 "bounds": [100, 100], |
| 57 "contentsOpaque": true, |
| 58 "drawsContent": true, |
| 59 "backgroundColor": "#0000FF" |
| 60 }, |
| 61 { |
| 62 "name": "Squashing Containment Layer", |
| 63 "shouldFlattenTransform": false |
| 64 }, |
| 65 { |
| 66 "name": "LayoutBlockFlow (positioned) DIV class='box middle'", |
| 67 "position": [20, 20], |
| 68 "bounds": [100, 100], |
| 69 "contentsOpaque": true, |
| 70 "drawsContent": true, |
| 71 "backgroundColor": "#008000", |
| 72 "transform": [ |
| 73 [0.707106781186548, 0.707106781186548, 0, 0], |
| 74 [-0.707106781186548, 0.707106781186548, 0, 0], |
| 75 [0, 0, 1, 0], |
| 76 [0, 0, 0, 1] |
| 77 ], |
| 78 "paintInvalidations": [ |
| 79 { |
| 80 "object": "LayoutBlockFlow (positioned) DIV class='box middle'", |
| 81 "rect": [0, 0, 100, 100], |
| 82 "reason": "style change" |
| 83 } |
| 84 ] |
| 85 }, |
| 86 { |
| 87 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (positione
d) DIV class='box top')", |
| 88 "position": [180, 180], |
| 89 "bounds": [100, 100], |
| 90 "drawsContent": true |
| 91 } |
| 92 ], |
| 93 "objectPaintInvalidations": [ |
| 94 { |
| 95 "object": "LayoutBlockFlow (positioned) DIV class='box middle'", |
| 96 "reason": "style change" |
| 97 } |
| 98 ] |
| 99 } |
| 100 CASE 3, hovering over the inner div |
| 101 { |
| 102 "layers": [ |
| 103 { |
| 104 "name": "LayoutView #document", |
| 105 "bounds": [800, 600], |
| 106 "contentsOpaque": true, |
| 107 "drawsContent": true |
| 108 }, |
| 109 { |
| 110 "name": "LayoutBlockFlow (positioned) DIV class='composited box behind'", |
| 111 "position": [100, 100], |
| 112 "bounds": [100, 100], |
| 113 "contentsOpaque": true, |
| 114 "drawsContent": true, |
| 115 "backgroundColor": "#0000FF" |
| 116 }, |
| 117 { |
| 118 "name": "Squashing Containment Layer", |
| 119 "shouldFlattenTransform": false |
| 120 }, |
| 121 { |
| 122 "name": "LayoutBlockFlow (positioned) DIV class='box middle'", |
| 123 "position": [20, 20], |
| 124 "bounds": [100, 100], |
| 125 "contentsOpaque": true, |
| 126 "drawsContent": true, |
| 127 "backgroundColor": "#008000", |
| 128 "transform": [ |
| 129 [0.707106781186548, 0.707106781186548, 0, 0], |
| 130 [-0.707106781186548, 0.707106781186548, 0, 0], |
| 131 [0, 0, 1, 0], |
| 132 [0, 0, 0, 1] |
| 133 ], |
| 134 "paintInvalidations": [ |
| 135 { |
| 136 "object": "LayoutBlockFlow (positioned) DIV class='box middle'", |
| 137 "rect": [0, 0, 100, 100], |
| 138 "reason": "style change" |
| 139 }, |
| 140 { |
| 141 "object": "LayoutBlockFlow (positioned) DIV class='smallbox'", |
| 142 "rect": [20, 25, 50, 50], |
| 143 "reason": "style change" |
| 144 } |
| 145 ] |
| 146 }, |
| 147 { |
| 148 "name": "Squashing Layer (first squashed layer: LayoutBlockFlow (positione
d) DIV class='box top')", |
| 149 "position": [180, 180], |
| 150 "bounds": [100, 100], |
| 151 "drawsContent": true |
| 152 } |
| 153 ], |
| 154 "objectPaintInvalidations": [ |
| 155 { |
| 156 "object": "LayoutBlockFlow (positioned) DIV class='box middle'", |
| 157 "reason": "style change" |
| 158 }, |
| 159 { |
| 160 "object": "LayoutBlockFlow (positioned) DIV class='smallbox'", |
| 161 "reason": "style change" |
| 162 } |
| 163 ] |
| 164 } |
| 165 |
OLD | NEW |