css - 动画迭代延迟 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 */ }
}

这远非理想。
您可以查看此相关问题以了解其他解决方法。