Posso animare l'elemento posizionato assoluto con la transizione CSS?

Question

Voglio animare il cambiamento di posizione di un elemento con transizione CSS, ma non funziona nemmeno quando uso il passaggio su all proprietà, come nell'esempio qui: http://jsfiddle.net/yFy5n/3/

Tuttavia, non voglio che la mia soluzione finale per applicare la transizione a tutte le proprietà, ma solo sulla modifica della posizione. Quindi il cambio di colore dovrebbe essere istantaneo, solo il cambio di posizione da sinistra a destra dovrebbe essere animato (l'opposto di ciò che sta accadendo ora).

Answer 1

Si è dimenticato di definire il valore predefinito per left in modo che non sappia come animare.

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

vedere qui: http://jsfiddle.net/shomz/yFy5n/5/

Answer 2

provare questo:

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

Answer 3

Si prega di provare questo codice margin-left:60px invece di left:60px

prega di dare un'occhiata: http://jsfiddle.net/hbirjand/2LtBh/2/

come @Shomz detto, transitio n deve essere modificato in transition:margin 1s linear; anziché transition:all 1s linear;