transitiontransformanimate的区别？

Posted 2020-11-24 yinhao-jack

1、transition、transform、animate的区别？

transition：过渡效果，它有4个属性：transition: property duration timing-function delay;

property ：css属性的名称

duration ：多长时间完成

timing-function：转速曲线

delay：开始的时候。

 

transform： 应用于元素的2D或3D转换。这个属性允许你将元素旋转，缩放，移动，倾斜等。

旋转：rotate（）、缩放：scale（）、移动：translate（）、倾斜：skew（）

 

animate：动画效果。

animation: name duration timing-function delay iteration-count direction fill-mode play-state;

name ：定义的名称

duration ：多长时间完成

delay ：开始前多长的延迟

iteration-count：播放几次

direction ：指定是否应该轮流反向播放动画。

fill-mode：结束的状态

play-state：指定动画是否正在运行或已暂停。