Question

css3 animation 多个组件动画的循环

如题，每个stage下的root-banch都有各自独立的动画 且需要fowards，如何可以使所有动画播放完 再让他重新开始播放呢
<div class="stage-content">
<ul class="stage-1-icon">
<li class="stage-1-root"><span class="stage-1-banch"></span></li>
<li class="stage-2-root"><span class="stage-2-banch"></span></li>
<li class="stage-3-root"><span class="stage-3-banch"></span></li>
<li class="stage-4-root"><span class="stage-4-banch"></span></li>
</ul>

Answer 1

动画中有animation-iteration-count这个属性，这个是规定播放的次数。这个属性有2个参数：1、如果是数字的话那就是播放几次后停止。2、infinite这个是无限次播放。

animation-iteration-count:3;
-webkit-animation-iteration-count:3;
/*循环播放3次*/

animation-iteration-count:infinite;
-webkit-animation-iteration-count:infinite;
/*无限次播放*/

追问

每个root都是独立的animetion
就是等于我再stage下面的每个root都有各自独立的动画编制

现在我想让整个stage 循环播放 是这个意思

追答

那你就在给stage添加一个animation啊