transiciones transicion examples ejemplos efectos avanzadas animaciones css css-transitions

transicion - transition css hover



¿Puedo animar el elemento posicionado absoluto con la transición de CSS? (3)

Quiero animar el cambio de posición de un elemento con la transición de CSS, pero no funciona incluso cuando uso la transición en all propiedades, como en el ejemplo aquí: http://jsfiddle.net/yFy5n/3/

Sin embargo, no quiero que mi solución final aplique la transición a todas las propiedades, sino solo en el cambio de posición. Entonces, el cambio de color debe ser instantáneo, solo el cambio de posición de izquierda a derecha debe ser animado (lo opuesto a lo que está sucediendo ahora).


Olvidó definir el valor predeterminado para la left para que no sepa cómo animar.

.test { left: 0; transition:left 1s linear; }

Consulte aquí: http://jsfiddle.net/shomz/yFy5n/5/


Por favor, intente este código margin-left:60px lugar de left:60px

por favor, eche un vistazo: http://jsfiddle.net/hbirjand/2LtBh/2/

como dijo @Shomz, la transición debe cambiarse a transition:margin 1s linear; En lugar de transition:all 1s linear;


prueba esto:

.test { position:absolute; background:blue; width:200px; height:200px; top:40px; transition:left 1s linear; left: 0; }