Uso de animaciones CSS3 en IE9 +

¡He intentado que estas animaciones css3 funcionen en IE9 durante unas horas hoy y estoy perplejo!Uso de animaciones CSS3 en IE9 +

Intenté implementar algunos errores de JavaScript pero mi conocimiento es muy limitado, así que fallaron. No estoy seguro si estaba fallando debido a mis errores de usuario o errores de código.

Aquí está un jsFiddle de mi código hasta el momento, he reemplazado las imágenes de fondo con los colores. Básicamente, los cuadrados verdes y negros rotan en los navegadores Firefox y Webkit.

http://jsfiddle.net/fJxsV/

quiero tener que se ejecuta en IE9 también.

Si puede ayudarme con esto, ¡le estaría muy agradecido!

Fuente

2012-01-30 Mathew Hood

+10

transiciones y animaciones CSS3 no funcionan en IE9. Deben * funcionar * en IE10. –

Funcionan en IE9 con bibliotecas jQuery, lo que les permite. Simplemente no sé cómo implementar esto. http://addyosmani.com/blog/css3transitions-jquery/ –

No del todo :). Ese complemento prueba el soporte de transición, y si se detecta soporte, usa transiciones de CSS puro. De lo contrario, utiliza las funciones de animación interna de jQuery para realizar la animación. El complemento no habilita las transiciones CSS3 en IE9, y jQuery no admite nativamente las animaciones de rotación. Necesita utilizar un complemento como este: http://www.zachstronaut.com/posts/2009/08/07/jquery-animate-css-rotate-scale.html, pero esto no hará las cosas de tipo alternativo como por su enlace. Entonces, si * DEBE * funcionar en IE9, no se preocupe por las cosas nativas de CSS3, simplemente haga toda la animación en JS usando este complemento. –

Usaría Modernizr para detectar cuando las animaciones css no son compatibles. Con Modernizr, es tan simple como:

if(!Modernizr.cssanimations) { 
    //jQuery fallback 
}

En cuanto a rotación con jQuery yo usaría: http://jqueryrotate.com/

Fuente

2013-03-05 00:18:45 eivers88

No es la respuesta. La pregunta es ¿cómo? –

La pregunta ya se ha respondido en los comentarios anteriores (las transiciones CSS3 y las animaciones no funcionan en IE9). Mi respuesta es una solución al hecho de que no puedes usar animaciones CSS3 en IE9. – eivers88

Muchas gracias por mencionar jQuery rotar. – LINQ

Respuesta

Cuestiones relacionadas