Question

我正在使用以下内容为文本提供一种脉动效果，但动画似乎不适用于chrome。我做错了什么？

.item{
    -webkit-animation: caMenuTextOut 600ms ease-in-out;
    -moz-animation: caMenuTextOut 600ms ease-in-out;
    animation: caMenuTextOut 600ms ease-in-out;
}
@keyframes caMenuTextOut {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0;
        transform: scale(2);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

Answer 1

Chrome doesn't support standard animations yet。使用供应商前缀：@-webkit-keyframes。您可以在@keyframes的同时使用此功能，但不幸的是，您必须将整个事件声明两次。

http://jsfiddle.net/ExplosionPIlls/85hE5/

Css缩放动画不在chrome中工作

1 个答案: