transizione della scala di matrice non funzionante

Question

Devo usare la matrice di trasformazione per animare la trasformazione: scala di un elemento.

voglio scalare da 0 a 1. Se uso il seguente codice funziona correttamente:

.container { 
    width: 200px; 
    height: 100px; 
    background: yellow; 
    transform: scale(0); 
    transition: transform 1s; 
} 
.container.open { 
    transform: scale(1); 
} 

https://jsfiddle.net/w4kuth78/1/

Se uso matrice stessa, è non lavoro.

.container { 
    width: 200px; 
    height: 100px; 
    background: yellow; 
    transform: matrix(0, 0, 0, 0, 0, 0); 
    transition: transform 1s; 
} 
.container.open { 
    transform: matrix(1, 0, 0, 1, 0, 0); 
} 

https://jsfiddle.net/m7qpetkh/1/

Sto facendo qualcosa di sbagliato o è solo che non funziona? Mi chiedo, perché non funziona in Chrome e Firefox ...

L'output di debug di console_log dice che al ridimensionamento da 0 a 1 la matrice viene impostata anche dalla matrice (0,0,0,0, 0,0) a matrice (1,0,0,1,0,0).

EDIT:

confusione totale ... Se cambio i valori scaleX e scaleY nella matrice di 0,1 o 0,01 funziona ... wow

Answer 1

Durante l'animazione o transizione trasforma, la trasformazione gli elenchi di funzioni devono essere interpolati. Due funzioni di trasformazione con lo stesso nome e lo stesso numero di argomenti sono interpolate numericamente senza una conversione precedente. Il valore calcolato sarà dello stesso tipo di funzione di trasformazione con lo stesso numero di argomenti.

Le regole speciali si applicano a rotate3d(), matrix(), matrix3d ​​() e perspective(). Le funzioni di trasformazione matrix(), matrix3d ​​() e perspective() vengono prima convertite in matrici 4x4 e interpolate. Se una delle matrici per l'interpolazione è singolare o non invertibile (se il suo determinante è 0), l'elemento trasformato non viene reso e la funzione di animazione utilizzata deve ricorrere a un'animazione discreta in base alle regole della rispettiva specifica dell'animazione.

Poi, nel caso di matrice (0,0,0,0,0,0) è ovvio, le matrici 4x4 risultato di scala sono singolari

Considerazioni per http://www.w3.org/TR/css3-2d-transforms/