css - 在 Mozilla 中动画前变换

Question

我想要变换(缩放)横幅中的一些图像，但是我想在执行动画之前执行此操作，因为我不希望缩放动画。这是代码片段:

<span class="animate"><img src="http://upload.wikimedia.org/wikipedia/commons/thumb/2/22/Turkish_Van_Cat.jpg/1024px-Turkish_Van_Cat.jpg" /></span>

#banner img{
zoom:0.66;
-moz-transform: scale(0.66);
-moz-transform-origin: 0 0;
-o-transform: scale(0.66);
-o-transform-origin: 0 0;
-webkit-transform: scale(0.66);
-webkit-transform-origin: 0 0;
transform: scale(0.66); /* Standard Property */
transform-origin: 0 0;  /* Standard Property */
position: absolute;
top: 40px;
left: 50px;
}

#banner span{
-webkit-animation-duration: .6s;
-webkit-animation-timing-function: ease;
-webkit-animation-fill-mode: both;
-moz-animation-duration: .6s;
-moz-animation-timing-function: ease;
-moz-animation-fill-mode: both;
-ms-animation-duration: .6s;
-ms-animation-timing-function: ease;
-ms-animation-fill-mode: both;
animation-duration: .6s;
animation-timing-function: ease;
animation-fill-mode: both;

-webkit-animation-delay: .2s;
-moz-animation-delay: .2s;
-ms-animation-delay: .2s;
animation-delay: .2s;
}

Answer 1

您可以使用 jquery 设置动画 A 结束时将开始动画 B。

我相信可以找到您问题的解决方案 here