精灵动画实现的手段太多了,比如定时器的帧动画,CSS3的animation动画,canvas动画
经过我大量实践,我项目使用中最为理想的方式:通过CSS3关键帧运行动画
但是不管如何实现,都需要解决雪碧图的自适应分辨问题
目前来说,雪碧图常规的方案一般会做几套不同大小的图去适应不同的设备尺寸
如果只采用一套图如何做自适应处理?
经过研究在移动端可以采用background-size的处理达到这个目的
如何做大量的关键帧动画?靠写死
通过动态脚本生成
如果动画多写一堆的样式就是一个蛋疼的事
所以这里我建议可以采用脚本生成关键帧
通过内联style加载,这样的处理是极好的。
winglau14 / css3-adaptive-sprite Goto Github PK
View Code? Open in Web Editor NEWThis project forked from linsetonghua/adaptive-sprite
CSS3技术:雪碧图自适应缩放与精灵动画方案