常见帧动画的3种方式:
1、GIF
2、CSS3 animation
3、javascript
前两种的不足:不能灵活的控制动画的暂停和播放;不能捕捉动画完成的时间 GIF不可以;不能对帧动画做更多灵活的扩展
js实现帧动画的原理:
1、如果有多张帧图片,用img标签去承载图片,定时的去更改img的src属性(不推荐这种方式,发送多个http请求,消耗资源性能)
2、把所有动画关键帧绘制在一张图片里,把图片作为元素css样式的background-image属性;定时改变background-position属性(推荐)
制做帧动画,关键于实现一个通用的接口。也就像是你可以复用动画库的代码。