Anime.js - Una biblioteca ligera de animación en JavaScript

La animación web ha recorrido un largo camino. Los desarrolladores no solo pueden hacer animaciones con un combo de CSS / SVG / JS, sino que también hay docenas de bibliotecas gratuitas para ahorrar tiempo en el proceso.

Uno de mis favoritos es Anime.js, una biblioteca de animación de JavaScript de código abierto completamente gratuita.

Esta biblioteca puede hacerlo todo . Se basa en JavaScript pero también depende en gran medida de las animaciones CSS . Puede orientar elementos de página individuales a través del DOM o incluso puede orientar SVG personalizados .

Toda la documentación está alojada en GitHub, por lo que puede necesitar desplazarse para encontrar exactamente lo que está buscando. Pero cada función de animación viene con algunos parámetros, como el retraso, la duración y la aceleración.

Tenga en cuenta que esta biblioteca no viene con muchos estilos de animación predeterminados. Anime.js está hecho para desarrolladores que desean personalizar sus animaciones sin escribir código detallado .

Para ver un ejemplo en vivo, consulte el bolígrafo Codepen a continuación. El código es extremadamente simple, pero se obtiene una animación creíble con squash y stretch plus anticipación, ambos fundamentos de la animación.

Una advertencia justa: la biblioteca de Anime.js es densa . No es tan difícil crear una animación personalizada, pero es necesario que comprenda algunos conceptos básicos como la simplificación y la sintaxis común de JavaScript para las devoluciones de llamada y las opciones.

Pero toda la información que necesita está en la página de repositorio, incluidas muchas muestras de código y tablas de documentación detalladas . Y puede navegar a través de abrir informes de errores o consultar el soporte del navegador que actualmente incluye todos los principales navegadores e IE 10+ .

Esta es fácilmente una de las mejores bibliotecas de animación para desarrolladores web y debería ser su solución de búsqueda para cualquier animación web compleja .

Para ver un montón de ejemplos en vivo, mira esta colección de demos de Anime.js alojadas en CodePen. A continuación, incrustó mi favorito que anima todo el logotipo desde cero, con verdadera vivacidad.

15 casos alternativos de iPhone para la caja de batería inteligente de Apple

Así que Apple lanzó una nueva funda de batería para el iPhone 6 y 6s que se supone que extenderá la duración de la batería de los dos modelos hasta la marca de 25 horas. Va por $ 99 por pieza y está disponible en blanco y negro (hasta ahora). El diseño de "¿qué es eso?" Deja mucho que desear y probablemente inicie pronto un hashtag de tendencia, pero no lo malgastemos en este punto.En cambio

(Consejos de tecnología y diseño)

Cómo ejecutar un reinicio de emergencia en Windows 8 [Quicktip]

Cerrar tu Windows rápidamente es casi imposible. A veces tiene que esperar el tiempo de espera, otras veces se le pide que guarde este archivo y cierre ese documento, y lo peor de todo es cuando tiene que sentarse entre las toneladas de actualizaciones de Windows otorgadas a su máquina. Para algunos de nosotros, cuando tenemos que irnos, tenemos que irnos.P

(Consejos de tecnología y diseño)