Why isn't -moz-animation working?

Question

The following CSS works fine in Webkit. Haven\'t checked it in Opera, but I know it\'s not working in Firefox. Can anybody tell me why?

The correct classes are defin

Answer 1

Your animations are not working in Firefox because you are using @-webkit-keyframes, which only applies to Webkit browsers, i.e. Chrome and Safari. The (somewhat) cross-browser way to do animation keyframes is:

@keyframes animationName {
    /* animation rules */
}

@-moz-keyframes animationName {
    /* -moz-animation rules */
}

@-webkit-keyframes animationName {
    /* -webkit-animation rules */
}

Opera and Internet Explorer do not currently support the @keyframes rule.