首页 > CSS3 Animation only working in Chrome

CSS3 Animation only working in Chrome

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);
 }

}

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

【热门文章】
【热门文章】