OLD | NEW |
| (Empty) |
1 Tests the display of animations on the animation timeline. | |
2 | |
3 >>>> Animation with start delay only | |
4 <g style="transform: translateX(83.3333333333333px);"><g style="transform: trans
lateX(0px);"><line class="animation-line" x1="8" y1="32" y2="32" x2="258" style=
"stroke: rgb(0, 188, 212);"></line><path class="animation-keyframe" d="M 0 32 L
0.011523437499999999 13.350945748866874 L 0.5285156249999999 13.350945748866874
L 1.9771484375 13.350945748866874 L 4.307031250000001 13.350945748866874 L 7.467
773437500001 13.350945748866874 L 11.408984375000001 13.350945748866874 L 16.080
273437499997 13.350945748866874 L 21.43125 13.350945748866874 L 27.4115234374999
98 13.350945748866874 L 33.970703124999986 13.350945748866874 L 41.0583984374999
9 13.350945748866874 L 48.62421874999999 13.350945748866874 L 56.617773437500006
13.350945748866874 L 64.98867187500001 13.350945748866874 L 73.68652343750003 1
3.350945748866874 L 82.66093750000003 13.350945748866874 L 91.86152343750004 13.
350945748866874 L 101.23789062500003 13.350945748866874 L 110.73964843750007 13.
350945748866874 L 120.31640625000004 13.350945748866874 L 129.91777343750005 13.
350945748866874 L 139.49335937500007 13.350945748866874 L 148.99277343750006 13.
350945748866874 L 158.36562500000008 13.350945748866874 L 167.56152343750006 13.
350945748866874 L 176.53007812500007 13.350945748866874 L 185.22089843750007 13.
350945748866874 L 193.5835937500001 13.350945748866874 L 201.5677734375001 13.35
0945748866874 L 209.1230468750001 13.350945748866874 L 216.19902343750007 13.350
945748866874 L 222.7453125000001 13.350945748866874 L 228.7115234375001 13.35094
5748866874 L 234.0472656250001 13.350945748866874 L 238.70214843750006 13.350945
748866874 L 242.62578125000005 13.350945748866874 L 245.76777343750004 13.350945
748866874 L 248.07773437500006 13.350945748866874 L 249.5052734375 13.3509457488
66874 L 250 13.350945748866874 L 250 32 Z" style="transform: translateX(8px); fi
ll: rgb(0, 188, 212);"></path><circle class="animation-endpoint" cx="8" cy="32"
r="4" style="stroke: rgb(0, 188, 212); fill: rgb(0, 188, 212);"></circle><circle
class="animation-endpoint" cx="258" cy="32" r="4" style="stroke: rgb(0, 188, 21
2); fill: rgb(0, 188, 212);"></circle></g><g class="animation-tail-iterations"><
/g></g><line class="animation-delay-line" x1="8" y1="32" y2="32" x2="91.33333333
333334" style="stroke: rgb(0, 188, 212);"></line><line class="animation-delay-li
ne" x1="8" y1="32" y2="32" x2="8" style="stroke: rgb(0, 188, 212); transform: tr
anslateX(333.333333333333px);"></line> | |
5 >>>> Animation with start and end delay | |
6 <g style="transform: translateX(55.5555555555556px);"><g style="transform: trans
lateX(0px);"><line class="animation-line" x1="8" y1="32" y2="32" x2="174.6666666
6666669" style="stroke: rgb(156, 39, 176);"></line><path class="animation-keyfra
me" d="M 0 32 L 0.007682291666666667 13.350945748866874 L 0.35234374999999996 13
.350945748866874 L 1.3180989583333333 13.350945748866874 L 2.871354166666668 13.
350945748866874 L 4.978515625000001 13.350945748866874 L 7.605989583333335 13.35
0945748866874 L 10.720182291666665 13.350945748866874 L 14.287500000000001 13.35
0945748866874 L 18.274348958333334 13.350945748866874 L 22.64713541666666 13.350
945748866874 L 27.372265624999997 13.350945748866874 L 32.41614583333333 13.3509
45748866874 L 37.74518229166667 13.350945748866874 L 43.32578125000001 13.350945
748866874 L 49.12434895833336 13.350945748866874 L 55.1072916666667 13.350945748
866874 L 61.24101562500003 13.350945748866874 L 67.49192708333337 13.35094574886
6874 L 73.82643229166672 13.350945748866874 L 80.21093750000004 13.3509457488668
74 L 86.61184895833338 13.350945748866874 L 92.99557291666672 13.350945748866874
L 99.32851562500005 13.350945748866874 L 105.57708333333339 13.350945748866874
L 111.70768229166671 13.350945748866874 L 117.68671875000007 13.350945748866874
L 123.48059895833339 13.350945748866874 L 129.05572916666674 13.350945748866874
L 134.3785156250001 13.350945748866874 L 139.41536458333343 13.350945748866874 L
144.13268229166673 13.350945748866874 L 148.49687500000007 13.350945748866874 L
152.47434895833342 13.350945748866874 L 156.03151041666675 13.350945748866874 L
159.13476562500006 13.350945748866874 L 161.75052083333338 13.350945748866874 L
163.8451822916667 13.350945748866874 L 165.38515625000005 13.350945748866874 L
166.33684895833335 13.350945748866874 L 166.66666666666669 13.350945748866874 L
166.66666666666669 32 Z" style="transform: translateX(8px); fill: rgb(156, 39, 1
76);"></path><circle class="animation-endpoint" cx="8" cy="32" r="4" style="stro
ke: rgb(156, 39, 176); fill: rgb(156, 39, 176);"></circle><circle class="animati
on-endpoint" cx="174.66666666666669" cy="32" r="4" style="stroke: rgb(156, 39, 1
76); fill: rgb(156, 39, 176);"></circle></g><g class="animation-tail-iterations"
></g></g><line class="animation-delay-line" x1="8" y1="32" y2="32" x2="63.555555
55555556" style="stroke: rgb(156, 39, 176);"></line><line class="animation-delay
-line" x1="8" y1="32" y2="32" x2="119.11111111111111" style="stroke: rgb(156, 39
, 176); transform: translateX(222.222222222222px);"></line> | |
7 | |
OLD | NEW |