前端实现动画

1，按照之前看过的一篇文章，动画分为补间动画，逐帧动画、canvas动画和svg动画。

2，css的过渡效果大多数情况下是规定了初始状态和结束状态，中间状态用css3自带的api实现，这种事补间动画。

3，利用setTimeout或者requestAnimationFrame通过修改属性的关键参数实现的则是逐帧动画

4，用来区分补间还是逐帧的区别是中间状态是否则自己所设置。

5，canvas动画和svg再说。

在使用动画上面，出于兼容性和性能的考虑优先使用css3，然后可以考虑使用js或者canvas或者svg。

css动画总结

1，利用过渡效果实现：transition，注意对display没有效果。

2，利用animation，animation对display也没有效果。animation.css实现的淡入淡出实际针对的opacity。

3，然后还可以借助css3的曲线函数，也就是运动曲线函数。

4，js实现是利用数学知识实现数量的指定变化。

转载于:https://www.cnblogs.com/zhensg123/p/10500608.html