| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 | 2 |
| 3 <script src="../../resources/js-test.js"></script> | 3 <script src="../../resources/js-test.js"></script> |
| 4 | 4 |
| 5 <style> | 5 <style> |
| 6 @-webkit-keyframes example { | 6 @keyframes example { |
| 7 from { width: 50px; height: 50px; } | 7 from { width: 50px; height: 50px; } |
| 8 to { width: 10px; height: 10px; } | 8 to { width: 10px; height: 10px; } |
| 9 } | 9 } |
| 10 | 10 |
| 11 @keyframes example { | 11 @keyframes example { |
| 12 from { width: 50px; height: 50px; } | 12 from { width: 50px; height: 50px; } |
| 13 to { width: 10px; height: 10px; } | 13 to { width: 10px; height: 10px; } |
| 14 } | 14 } |
| 15 | 15 |
| 16 .after:after, | 16 .after:after, |
| 17 .before:before { | 17 .before:before { |
| 18 content: ""; | 18 content: ""; |
| 19 display: block; | 19 display: block; |
| 20 position: relative; | 20 position: relative; |
| 21 background: green; | 21 background: green; |
| 22 width: 10px; | 22 width: 10px; |
| 23 height: 10px; | 23 height: 10px; |
| 24 -webkit-animation: example 2s; | 24 animation: example 2s; |
| 25 -moz-animation: example 2s; | 25 -moz-animation: example 2s; |
| 26 animation: example 2s; | 26 animation: example 2s; |
| 27 } | 27 } |
| 28 | 28 |
| 29 .before, | 29 .before, |
| 30 .after { | 30 .after { |
| 31 display: inline-block; | 31 display: inline-block; |
| 32 border: 1px solid black; | 32 border: 1px solid black; |
| 33 background: red; | 33 background: red; |
| 34 } | 34 } |
| (...skipping 52 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 87 var div = document.getElementById('after'); | 87 var div = document.getElementById('after'); |
| 88 window.div = div; | 88 window.div = div; |
| 89 shouldBeCloseTo('div.offsetWidth', 12, 1); | 89 shouldBeCloseTo('div.offsetWidth', 12, 1); |
| 90 }, 2000); | 90 }, 2000); |
| 91 } | 91 } |
| 92 } | 92 } |
| 93 | 93 |
| 94 onload = testAnimations; | 94 onload = testAnimations; |
| 95 | 95 |
| 96 </script> | 96 </script> |
| OLD | NEW |