Articles of animation

Animación CSS3: visualización + opacidad

Tengo un problema con una animación CSS3. .child { opacity: 0; display: none; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; } .parent:hover .child { opacity: 0.9; display: block; } Este código solo funciona si elimino el cambio de display . Quiero cambiar la pantalla justo después del control deslizante pero […]

Blackberry: animación de diseño de campos

Es fácil mostrar algunas animaciones dentro de un campo – BitmapField o pantalla: [Blackberry – imagen de fondo / animación RIM OS 4.5.0] [1] Pero, ¿qué sucede si necesita mover campos , no solo imágenes? Puede ser usado: funcionalidad del flujo de trabajo del juego, como ajedrez, rompecabezas, etc. diseño definido por el usuario de […]

¿Cómo puedo agregar una animación al final de la actividad ()?

Estoy usando overridePendingTransition para cuando se crea mi actividad y eso funciona bien. Puedo ver que el fundido funciona muy bien, pero cuando bash animar el final de la actividad, sigo haciendo la diapositiva predeterminada de derecha a izquierda. Primero intenté definir la animación de salida cuando comencé la actividad de la siguiente manera: Intent […]

Comience la actividad con una animación

Estoy tratando de comenzar una actividad con una animación de transición personalizada. La única forma que he encontrado hasta ahora para hacer esto (sin usar onPendingTransition () en la actividad anterior) es usar un tema personalizado en la actividad y definir activityOpenEnterAnimation, taskOpenEnterAnimation, windowEnterAnimation o windowAnimationStyle para establecer la animación. Pero ninguno de estos atributos […]

Cómo crear un indicador de progreso circular para un temporizador de cuenta regresiva

Estoy intentando agregar una cuenta regresiva a mi aplicación y tengo problemas para animar esto. El aspecto que busco es algo similar a la cuenta regresiva del iPad que se muestra a continuación, con la barra roja aumentando a medida que el reloj cuenta hacia abajo. Inicialmente creé un atlas de imagen con una imagen […]

Cambia automáticamente el tamaño del canvas para rellenar el archivo adjunto

Hace poco, quería crear un fondo animado en JavaFX, similar al ejemplo de Swing que se muestra aquí . Utilicé un Canvas en el que dibujar, como se muestra en Trabajar con la API Canvas , y un AnimationTimer de AnimationTimer para el ciclo de dibujo, como se muestra en Conceptos básicos de animación . […]

animar JPanel (deslizar hacia adentro) con temporizador

Estoy tratando de hacer una entrada de JPanel desde un lado utilizando esta clase que hice: public class AnimationClass { private int i; private int y; private JPanel panel; private int xTo; private Timer timer; private int xFrom; synchronized void slidePanelInFromRight(JPanel panelInput, int xFromInput, int xToInput, int yInput, int width, int height) { this.panel = […]

jQuery usando append con efectos

¿Cómo puedo usar .append() con efectos como show(‘slow’) Tener efectos en append no parece funcionar en absoluto, y da el mismo resultado que show() normal show() . Sin transiciones, sin animaciones. ¿Cómo puedo agregar un div a otro y tener un efecto slideDown o show(‘slow’) sobre él?

¿Cómo tener múltiples transiciones de CSS en un elemento?

Es una pregunta bastante sencilla, pero no puedo encontrar una documentación muy buena sobre las propiedades de transición de CSS. Aquí está el fragmento de CSS: .nav a { text-transform:uppercase; text-decoration:none; color:#d3d3d3; line-height:1.5 em; font-size:.8em; display:block; text-align:center; text-shadow: 0 -1.5em 0 rgba(255, 255, 255, 0.15); -webkit-transition: color .2s linear; -moz-transition: color .2s linear; -o-transition: color […]

Animaciones CSS con retraso para cada elemento secundario

Intento crear un efecto de cascada aplicando una animación a cada elemento secundario. Me preguntaba si hay una mejor manera de hacerlo que esto: .myClass img:nth-child(1){ -webkit-animation: myAnimation 0.9s linear forwards; } .myClass img:nth-child(2){ -webkit-animation: myAnimation 0.9s linear 0.1s forwards; } .myClass img:nth-child(3){ -webkit-animation: myAnimation 0.9s linear 0.2s forwards; } .myClass img:nth-child(4){ -webkit-animation: myAnimation 0.9s […]