Cómo crear animaciones css3 con stylie
Video: Cómo crear una navegación animada con CSS3 y jQuery
Conseguir una animación CSS3 justo puede ser difícil. Cada desarrollador tiene diferentes habilidades y formas de tareas de visualización. stylie está diseñado para los desarrolladores que están orientados visualmente más. Solo tiene que elegir un punto de inicio y de finalización para la animación, utilizando los valores de X e Y.
El valor R determina la cantidad de rotación que el objeto animado realiza. Puede elegir el tiempo se produce la animación usando los valores de tiempo. Además, la X, los valores de Y, y R puede tener cada uno un efecto de animación asociada con ellos.
Muchas animaciones se mueven en más de una dirección. Haga clic en el signo más (+) para añadir otra dirección. Esta dirección también tiene X, Y, y los valores de R y se puede establecer su duración y efectos especiales también. En resumen, se puede utilizar esta interfaz para crear efectos de animación increíblemente complejos que van en más de una dirección.
La ficha Movimiento define las características de la animación, tales como el número de veces que desea que la animación a ejecutar (se puede elegir para que la ejecución de un bucle infinito) y la forma en que el objeto que está animando debe interactuar con la trayectoria de animación.
Esta es también la ficha se utiliza para definir el suavizado que se utiliza para hacer el efecto de animación fluya sin problemas. Una animación de línea recta es simple, pero el alivio se vuelve importante cuando se inicia el trabajo con animaciones que se mueven en más de una dirección.
Después de terminar la configuración de la animación, hacer clic en la pestaña CSS, que contiene el CSS que se utiliza para crear el efecto de animación en su aplicación. La ficha CSS le permite elegir un nombre para la clase de animación. También puede seleccionar qué proveedores para incluir como parte de la CSS y el nivel de calidad de la animación.
La ficha HTML contiene etiquetas de muestra que necesita para completar la animación. Este es el lugar donde había necesidad de hacer modificaciones para incluir el objeto que desea animar en lugar del círculo simple suministrada por Stylie.