Al usar transiciones CSS/animaciones/etc., ¿cuál es la mejor manera de recurrir a jquery si el navegador de los usuarios no hace animaciones css?

Question

Estoy buscando una forma de usar css animations, pero si el navegador de los usuarios no hace css animations - para luego recurrir a Jquery para la animación. ¿Hay alguna manera fácil de hacer esto en Jquery? un plugin estaría BIEN, si fuera un pequeño complemento, pero realmente estoy buscando alguna forma de hacerlo en jquery si es posible. La única razón por la que quiero usar css animations es porque la potencia del procesador es mucho menor cuando se usan animaciones css.

Answer 1

El jQuery animate enhanced plugin utiliza transiciones CSS sin tener que escribir código específico para la transición navegadores capaces

la alternativa no es muy alentador: usted podría agregue una biblioteca de detección de funciones como Modernizr y luego escriba un código específico para cada caso, como ...

if (Modernizr.csstransitions) { 
    $("#yourdiv").css({ 
    "-webkit-transform" : "translate(0, 10)", 
    "-o-transform" : "translate(0, 10)", 
    "-moz-transform" : "translate(0, 10)", 
    "-ms-transform" : "translate(0, 10)", 
    "transform" : "translate(0, 10)" 
}); 
} 
else { 
    //do jquery animate stuff 
} 

Answer 2

jQuery recomienda usar jQuery.support para asegurarse de que el navegador mantenga cierta funcionalidad. Me gusta:

jQuery.support.opacity //returns true/false 

Core jQuery no da paso a la prueba de las propiedades de CSS3, pero los complementos sí. Usted puede encontrar algunos de estos plugins en los comentarios después de la descripción de la función (como this one)

Answer 3

No debería importarle. Las animaciones no son vitales. Si realizas una mejora progresiva, cada usuario obtendrá la mejor experiencia que su navegador le permita tener :).

Si te preocupa tanto la "potencia del procesador", no querrás tener animaciones en IE. De lo contrario, use solo jQuery, que parece ser el mejor para sus necesidades particulares.