css3延迟执行动画 CSS3 animation动画 循环间的延时执行时间

如下代码，其中的delay值为3s，但是animation按现在的规则，这个delay是指动画开始前的延时，在动画循环执行间，这个delay是不生效的。

.item{

webkit-animation: revolving 1s 3s infinite;

animation: revolving 1s 3s infinite;

}

@-webkit-keyframes revolving{

0%{

-webkit-transform: perspective(700px) rotateX(90deg);

}

50%{

-webkit-transform: perspective(700px) rotateX(0deg);

}

100%{

-webkit-transform: perspective(700px) rotateX(-90deg);

}

}

把总动画设为4秒，然后前75%也就是3秒都没变化(0-75%)，之后的25%也就是1秒做动画就可以了。

.item{

webkit-animation: revolving 4s 0s infinite;

animation: revolving 4s 0s infinite;

}

@-webkit-keyframes revolving{

0,75%{

-webkit-transform: perspective(700px) rotateX(90deg);

}

87