CSS3 Animation only working in Chrome
怪我咯
怪我咯 2017-04-17 11:10:04
0
1
587

I'm trying to animate some img nested inside an a. I created a simple CSS3 animation with prefixes, in Chrome it's working, but not in other browsers, any idea what's wrong?

.pulso:hover {
    -webkit-animation: pulso 2s ease infinite;
    -moz-animation: pulso 2s ease infinite;
    -ms-animation: pulso 2s ease infinite;
    animation: pulso 2s ease infinite;
}

    @keyframes "pulso" {
     0% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
     }
     50% {
        -webkit-transform: scale(1.05);
        -moz-transform: scale(1.05);
        -o-transform: scale(1.05);
        -ms-transform: scale(1.05);
        transform: scale(1.05);
     }
     100% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
     }

    }

@-moz-keyframes "pulso" {
 0% {
   -moz-transform: scale(1);
   transform: scale(1);
 }
 50% {
   -moz-transform: scale(1.05);
   transform: scale(1.05);
 }
 100% {
   -moz-transform: scale(1);
   transform: scale(1);
 }

}

@-webkit-keyframes pulso {
 0% {
   -webkit-transform: scale(1);
   transform: scale(1);
 }
 50% {
   -webkit-transform: scale(1.05);
   transform: scale(1.05);
 }
 100% {
   -webkit-transform: scale(1);
   transform: scale(1);
 }

}

@-ms-keyframes pulso {
 0% {
   -ms-transform: scale(1);
   transform: scale(1);
 }
 50% {
   -ms-transform: scale(1.05);
   transform: scale(1.05);
 }
 100% {
   -ms-transform: scale(1);
   transform: scale(1);
 }

}
怪我咯
怪我咯

走同样的路,发现不同的人生

全部回复(1)
PHPzhong

Remove all quotation.
把双引号都拿掉。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板