| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <style> | 4 <style> |
| 5 #box { | 5 #box { |
| 6 position: absolute; | 6 position: absolute; |
| 7 height: 100px; | 7 height: 100px; |
| 8 width: 100px; | 8 width: 100px; |
| 9 background-color: green; | 9 background-color: green; |
| 10 -webkit-animation: anim1 0.1s ease 0s forwards; | 10 -webkit-animation: anim1 0.1s ease 0s forwards; |
| 11 } | 11 } |
| 12 | 12 |
| 13 #correctposition { | 13 #correctposition { |
| 14 position: absolute; | 14 position: absolute; |
| 15 height: 100px; | 15 height: 100px; |
| 16 width: 100px; | 16 width: 100px; |
| 17 background-color: red; | 17 background-color: red; |
| 18 -webkit-transform: translate3d(50px, 200px, 0); | 18 transform: translate3d(50px, 200px, 0); |
| 19 } | 19 } |
| 20 | 20 |
| 21 @-webkit-keyframes anim1 { | 21 @-webkit-keyframes anim1 { |
| 22 from { | 22 from { |
| 23 -webkit-transform: translate3d(100px, 0, 0); | 23 transform: translate3d(100px, 0, 0); |
| 24 } | 24 } |
| 25 to { | 25 to { |
| 26 -webkit-transform: translate3d(200px, 0, 0); | 26 transform: translate3d(200px, 0, 0); |
| 27 } | 27 } |
| 28 } | 28 } |
| 29 | 29 |
| 30 @-webkit-keyframes anim2 { | 30 @-webkit-keyframes anim2 { |
| 31 from { | 31 from { |
| 32 -webkit-transform: translate3d(50px, 0, 0); | 32 transform: translate3d(50px, 0, 0); |
| 33 } | 33 } |
| 34 to { | 34 to { |
| 35 -webkit-transform: translate3d(50px, 200px, 0); | 35 transform: translate3d(50px, 200px, 0); |
| 36 } | 36 } |
| 37 } | 37 } |
| 38 </style> | 38 </style> |
| 39 <script> | 39 <script> |
| 40 | 40 |
| 41 var box; | 41 var box; |
| 42 var expectedValue = "matrix(1, 0, 0, 1, 50, 200)"; | 42 var expectedValue = "matrix(1, 0, 0, 1, 50, 200)"; |
| 43 | 43 |
| 44 function testState() | 44 function testState() |
| 45 { | 45 { |
| (...skipping 40 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 86 vertical, so the box should end up translated vertically down the page. | 86 vertical, so the box should end up translated vertically down the page. |
| 87 --> | 87 --> |
| 88 <div id="correctposition"> | 88 <div id="correctposition"> |
| 89 </div> | 89 </div> |
| 90 <div id="box"> | 90 <div id="box"> |
| 91 </div> | 91 </div> |
| 92 <div id="result"> | 92 <div id="result"> |
| 93 </div> | 93 </div> |
| 94 </body> | 94 </body> |
| 95 </html> | 95 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 637763002:
Unprefix usage of -webkit-transform in tests (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master