transiciones transicion keyframes examples ejemplos efectos avanzadas animaciones javascript html css polyfills css-transitions

javascript - keyframes - PolyFill/Shim para transiciones CSS y animaciones



transition css examples (2)

El proyecto de polímero de Google incluye un relleno de animaciones web para el borrador de las especificaciones de animaciones web del W3C .

Advertencia: este es un trabajo muy temprano, ya que la especificación W3C es solo un borrador de trabajo público, por lo que cualquier cosa podría cambiar. Además, los polímeros de polímero parecen estar dirigidos solo a la última versión de los navegadores (por ejemplo, IE10 +), por lo que es posible que no se ajuste a sus necesidades. Aún así, esto es al principio del proyecto, así que mantén un ojo en él y experimenta.

Si tiene cuidado de probar las plataformas en las que se encuentran sus usuarios, podría aprovechar la futura red hoy.

Google me está fallando un poco en esto (creo que porque la terminología de PolyFill / Shim / Spackle es nueva y diversa en este momento). Estoy intentando encontrar un buen PolyFill o Shim de JavaScript para las transiciones de CSS del webkit (y ahora a partir de RC FireFox 4).

Encontré este trabajo que hizo Weston Ruter , pero no se ha actualizado en mucho tiempo y utiliza la detección del navegador en lugar de la detección de características.

También descubrí FakeSmile pero está orientado principalmente a la animación SVG.

¿Alguien sabe de alguna buena biblioteca para completar esta funcionalidad? Preferiblemente, algo que funcionaría con Modernizr y aún se está trabajando activamente. Hasta ahora, la mejor opción parece ser comenzar con lo que se le ocurrió a Weston.


Hay un muy buen polyfill de transición para CSS3 llamado jQuery.transition .

Solo puede usar el método animate() habitual en jQuery, y utilizará automáticamente las transiciones CSS3, si están disponibles, y si no, volverá a jQuery.