OLD | NEW |
1 <html xmlns="http://www.w3.org/1999/xhtml"> | 1 <html xmlns="http://www.w3.org/1999/xhtml"> |
2 <style> | 2 <style> |
3 #svgRoot { | 3 #svgRoot { |
4 position: absolute; | 4 position: absolute; |
5 top: 0; | 5 top: 0; |
6 left: 0; | 6 left: 0; |
7 width: 100%; | 7 width: 100%; |
8 height: 100%; | 8 height: 100%; |
9 } | 9 } |
10 | 10 |
11 #transformOriginRect { | 11 #transformOriginRect { |
12 fill: green; | 12 fill: green; |
13 -webkit-transform: rotate(90deg); | 13 transform: rotate(90deg); |
14 } | 14 } |
15 </style> | 15 </style> |
16 | 16 |
17 <!-- | 17 <!-- |
18 Test for bug 79068 - SVG should support transform-origin and relative values. | 18 Test for bug 79068 - SVG should support transform-origin and relative values. |
19 | 19 |
20 You should see 9 green 20x20 rectangles. Each green rectangle is actually one
of a set of about 6, each one | 20 You should see 9 green 20x20 rectangles. Each green rectangle is actually one
of a set of about 6, each one |
21 with a different but equivalent value for the CSS transform-origin property. | 21 with a different but equivalent value for the CSS transform-origin property. |
22 --> | 22 --> |
23 | 23 |
(...skipping 30 matching lines...) Expand all Loading... |
54 | 54 |
55 for (var i = 0; i < equivalentTransformOrigins.length; i++) { | 55 for (var i = 0; i < equivalentTransformOrigins.length; i++) { |
56 var x = 60 + (i % 4) * 60; | 56 var x = 60 + (i % 4) * 60; |
57 var y = 60 + Math.floor(i / 4) * 60; | 57 var y = 60 + Math.floor(i / 4) * 60; |
58 equivalentTransformOrigins[i].map( function(s) { addTransformOriginRect
(x, y, s); } ); | 58 equivalentTransformOrigins[i].map( function(s) { addTransformOriginRect
(x, y, s); } ); |
59 } | 59 } |
60 | 60 |
61 ]]></script> | 61 ]]></script> |
62 </body> | 62 </body> |
63 </html> | 63 </html> |
OLD | NEW |