hooyantsing's Blog

P221_13_animation-direction控制动画方向的四种方式

字数统计: 127阅读时长: 1 min
2020/04/24

P221 13 animation-direction控制动画方向的四种方式

animation-direction

控制动画过渡方向。

normal

默认,正向。动画结束瞬间恢复到初始样式。

1c954ea3e4b51773adbc347f3fbacdc2.png

1
animation-direction: normal;

reverse

反向,类似倒放。动画结束瞬间恢复到初始样式。

233b1e07ab2f288d2227723e0b55267c.png

1
animation-direction: reverse;

P222 14 animation-direction动画平滑轮回处理

alternate

默认,正向。动画结束缓慢恢复到初始样式。

1c954ea3e4b51773adbc347f3fbacdc2.png

1
animation-direction: alternate;

alternate-reverse

反向,类似倒放。动画结束缓慢恢复到初始样式。

233b1e07ab2f288d2227723e0b55267c.png

1
animation-direction: alternate-reverse;
CATALOG