OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 | 2 |
3 <html> | 3 <html> |
4 <head> | 4 <head> |
5 <style type="text/css" media="screen"> | 5 <style type="text/css" media="screen"> |
6 | 6 |
7 #container { | 7 #container { |
8 position: relative; | 8 position: relative; |
9 border: 1px solid black; | 9 border: 1px solid black; |
10 height: 100px; | 10 height: 100px; |
(...skipping 20 matching lines...) Expand all Loading... |
31 } | 31 } |
32 90% { | 32 90% { |
33 left: 500px; | 33 left: 500px; |
34 animation-timing-function: ease-in; | 34 animation-timing-function: ease-in; |
35 } | 35 } |
36 100% { | 36 100% { |
37 left: 600px; | 37 left: 600px; |
38 } | 38 } |
39 } | 39 } |
40 </style> | 40 </style> |
41 <script src="resources/animation-test-helpers.js" type="text/javascript" chars
et="utf-8"></script> | 41 <script src="../resources/animation-test-helpers.js" type="text/javascript" ch
arset="utf-8"></script> |
42 <script type="text/javascript" charset="utf-8"> | 42 <script type="text/javascript" charset="utf-8"> |
43 | 43 |
44 const expectedValues = [ | 44 const expectedValues = [ |
45 // [time, element-id, property, expected-value, tolerance] | 45 // [time, element-id, property, expected-value, tolerance] |
46 [0.75, "box", "left", 300, 20], | 46 [0.75, "box", "left", 300, 20], |
47 ]; | 47 ]; |
48 | 48 |
49 runAnimationTest(expectedValues); | 49 runAnimationTest(expectedValues); |
50 </script> | 50 </script> |
51 </head> | 51 </head> |
52 <body> | 52 <body> |
53 | 53 |
54 Tests whether timing functions inside keyframes are respected. | 54 Tests whether timing functions inside keyframes are respected. |
55 <div id="container"> | 55 <div id="container"> |
56 <div id="box"></div> | 56 <div id="box"></div> |
57 </div> | 57 </div> |
58 <div id="result"> | 58 <div id="result"> |
59 </div> | 59 </div> |
60 </body> | 60 </body> |
61 </html> | 61 </html> |
OLD | NEW |