OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <style type="text/css"> | 4 <style type="text/css"> |
5 #target { | 5 #target { |
6 height: 50px; | 6 height: 50px; |
7 width: 50px; | 7 width: 50px; |
8 background-color: red; | 8 background-color: red; |
9 } | 9 } |
10 .animated { | 10 .animated { |
(...skipping 13 matching lines...) Expand all Loading... |
24 -webkit-animation-direction: reverse; | 24 -webkit-animation-direction: reverse; |
25 animation-direction: reverse; | 25 animation-direction: reverse; |
26 /* Default is none */ | 26 /* Default is none */ |
27 -webkit-animation-fill-mode: forwards; | 27 -webkit-animation-fill-mode: forwards; |
28 animation-fill-mode: forwards; | 28 animation-fill-mode: forwards; |
29 /* Default is ease */ | 29 /* Default is ease */ |
30 -webkit-animation-timing-function: linear; | 30 -webkit-animation-timing-function: linear; |
31 animation-timing-function: linear; | 31 animation-timing-function: linear; |
32 } | 32 } |
33 @-webkit-keyframes test { | 33 @-webkit-keyframes test { |
34 from { -webkit-transform: translateX(100px); } | 34 from { transform: translateX(100px); } |
35 to { -webkit-transform: translateX(300px); } | 35 to { transform: translateX(300px); } |
36 } | 36 } |
37 @keyframes test { | 37 @keyframes test { |
38 from { -webkit-transform: translateX(100px); } | 38 from { transform: translateX(100px); } |
39 to { -webkit-transform: translateX(300px); } | 39 to { transform: translateX(300px); } |
40 } | 40 } |
41 </style> | 41 </style> |
42 <script type="text/javascript"> | 42 <script type="text/javascript"> |
43 if (window.testRunner) { | 43 if (window.testRunner) { |
44 testRunner.dumpAsText(); | 44 testRunner.dumpAsText(); |
45 testRunner.waitUntilDone(); | 45 testRunner.waitUntilDone(); |
46 } | 46 } |
47 | 47 |
48 function go() { | 48 function go() { |
49 var target = document.getElementById('target'); | 49 var target = document.getElementById('target'); |
(...skipping 31 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
81 </head> | 81 </head> |
82 <body onload="go()"> | 82 <body onload="go()"> |
83 <p> | 83 <p> |
84 Tests that setting the iteration count, delay, duration, direction, fill | 84 Tests that setting the iteration count, delay, duration, direction, fill |
85 mode or timing function does not trigger an animation. | 85 mode or timing function does not trigger an animation. |
86 </p> | 86 </p> |
87 <div id="target"></div> | 87 <div id="target"></div> |
88 <div id="result"></div> | 88 <div id="result"></div> |
89 </body> | 89 </body> |
90 </html> | 90 </html> |
OLD | NEW |