OLD | NEW |
---|---|
(Empty) | |
1 var transformTranslate = { | |
2 keyframes: [ | |
3 {transform: 'translateX(0px)'}, | |
4 {transform: 'translateX(600px)'} | |
5 ], | |
6 style: `background: darkgreen; float: none;`, | |
7 samples: [ | |
alancutter (OOO until 2018)
2015/09/30 01:45:27
Is it necessary to wrap the fraction in {at:}?
Can
loyso (OOO)
2015/10/06 01:47:49
I want to keep it extensible (we have more Manual
| |
8 {at: 0}, | |
9 {at: 0.15}, | |
10 {at: 0.25}, | |
11 {at: 0.35}, | |
12 {at: 0.5}, | |
13 {at: 0.65}, | |
14 {at: 0.75}, | |
15 {at: 0.85}, | |
16 {at: 1.05}, | |
17 {at: 1.15}, | |
18 ] | |
19 }; | |
20 | |
21 var transformRotate = { | |
22 keyframes: [ | |
23 {transform: 'rotate(-10deg)'}, | |
24 {transform: 'rotate(360deg)'} | |
25 ], | |
26 style: `background: maroon; margin: 5px;`, | |
27 samples: [ | |
28 {at: 0}, | |
29 {at: 0.05}, | |
30 {at: 0.15}, | |
31 {at: 0.25}, | |
32 {at: 0.35}, | |
33 {at: 0.45}, | |
34 {at: 0.5}, | |
35 {at: 0.55}, | |
36 {at: 0.65}, | |
37 {at: 0.75}, | |
38 {at: 0.85}, | |
39 {at: 0.95}, | |
40 {at: 1.05}, | |
41 {at: 1.15}, | |
42 ] | |
43 }; | |
44 | |
45 var transformScale = { | |
46 keyframes: [ | |
47 {transform: 'scale(0.1)'}, | |
48 {transform: 'scale(1)'} | |
49 ], | |
50 style: `background: peru; margin: 5px;`, | |
51 markerStyle: '', // No marker. This mustn't affect cc/blink consistency, crbug .com/531290 | |
52 samples: [ | |
53 {at: 0}, | |
54 {at: 0.05}, | |
55 {at: 0.15}, | |
56 {at: 0.25}, | |
57 {at: 0.35}, | |
58 {at: 0.45}, | |
59 {at: 0.5}, | |
60 {at: 0.55}, | |
61 {at: 0.65}, | |
62 {at: 0.75}, | |
63 {at: 0.85}, | |
64 {at: 0.95}, | |
65 {at: 1.05}, | |
66 {at: 1.15}, | |
67 ] | |
68 }; | |
69 | |
70 var animateOpacity = { | |
71 keyframes: [ | |
72 {opacity: 0}, | |
73 {opacity: 1} | |
74 ], | |
75 style: `background: navy; margin: 5px;`, | |
76 samples: [ | |
77 {at: 0}, | |
78 {at: 0.05}, | |
79 {at: 0.15}, | |
80 {at: 0.25}, | |
81 {at: 0.35}, | |
82 {at: 0.45}, | |
83 {at: 0.5}, | |
84 {at: 0.55}, | |
85 {at: 0.65}, | |
86 {at: 0.75}, | |
87 {at: 0.85}, | |
88 {at: 0.95}, | |
89 {at: 1.05}, | |
90 {at: 1.15}, | |
91 ] | |
92 }; | |
93 | |
94 var simpleTests = [transformTranslate, transformRotate, transformScale, animateO pacity]; | |
95 | |
OLD | NEW |