Czy mogę animować element pozycjonowany absolutnie za pomocą przejścia CSS?

Question

Chcę animować zmianę położenia danego elementu z transformacji CSS, ale to nie działa nawet gdy używam przejścia na all właściwości, jak w tym przykładzie: http://jsfiddle.net/yFy5n/3/

Jednak nie chcę moje ostateczne rozwiązanie zastosować przejście do wszystkich właściwości, ale zamiast tego tylko w przypadku zmiany pozycji. Zmiana koloru powinna być natychmiastowa, tylko zmiana pozycji z lewej na prawą powinna być animowana (przeciwieństwo tego, co dzieje się teraz).

Answer 1

Nie pamiętasz, aby zdefiniować wartość domyślną dla left, aby nie było wiadomo, jak animować.

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

Zobacz tutaj: http://jsfiddle.net/shomz/yFy5n/5/

Answer 2

spróbuj tego:

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

Answer 3

Proszę Spróbuj kod margin-left:60px zamiast left:60px

proszę spojrzeć: http://jsfiddle.net/hbirjand/2LtBh/2/

jak @Shomz powiedział, transitio n należy zmienić na transition:margin 1s linear; zamiast na transition:all 1s linear;