动画迭代延迟CSS3

Question

是否有办法在每次迭代之间添加延迟?

EX:我想添加一个2s的初始延迟和一个10s的交互延迟

下面是一些代码: 代码:

/* PROCESSAR AQUI! */
/*...*/

/* KEYFRAMES */
@-webkit-keyframes transitdescription {
    15%     { margin-left: 45px;}
}
@-webkit-keyframes transitimage {
    0%      { right: -100%;}
    10%     { right: -webkit-calc(93% - 350px);}
    25%    { right: -webkit-calc(90% - 350px);}
    90%    { right: -webkit-calc(90% - 350px);}
    100%    { right: -webkit-calc(200%);}
}
@-webkit-keyframes rotateimg {
    50%  {-webkit-transform: rotate(-10deg);}
}
@-webkit-keyframes pluswidth {
    50%  {  width: 450px;}
}
@-webkit-keyframes leaveimage {
    50%  {  width: 450px;}
}

谢谢。

Answer 1

没有这样的属性，尽管有人建议。

有一些变通方法:

@-webkit-keyframes transitimage {
    /* animation here */
    10%, 100% { /* wait for 10 seconds without doing anything */ }
}

远非理想。
您可以在其他解决方法中看到与此相关的问题。