css3动画连续播放问题？

Question

比如有3个动画，第一个动画播放10次后执行第二个动画，第二个动画播放5次后执行第三个动画，怎么写？

Answer 1

用CSS写的话就是算延时，比如第一段动画你运行10次，每次1秒，那么第二段动画就是delay个10秒以后再执行，同理如果第二段是5次每次0.6秒的话，那么第三段的延时就是第一次的10秒加第二次的3秒，总共delay13秒后执行。其实一般这种队列动画，超过5个以上我个人都是建议上js的吧，像velocity.js这种框架都会有动画队列的设计，或者上个polyfill用最新的Web Animations API试试；用CSS的话算起来会很烦而且，如果碰到需求变更时量大的话很容易出错，不太划算。