旋轉使用CSS 3矩陣

Question

我使用CSS轉換這樣多於360度：

div 
{ 
    -webkit-transform: rotate(0deg); 
    -webkit-transition: -webkit-transform 2s; 
} 
div:hover 
{ 
    -webkit-transform: rotate(720deg); 
} 

這有效地使得在div旋轉2次2秒。現在我想使用矩陣，以便旋轉和縮放圖像;然而，矩陣不使用度，但是cos（a）和sin（a）以及我們都知道的cos（0）= cos（360）= cos（720）等。所以使用矩陣我無法旋轉圖像比359deg。

所以我決定要聰明，用JavaScript我把矩陣從旋轉的元素（720deg），它看起來像這樣：

-webkit-transform: matrix(1, -0.0000000000000004898587196589413, 0.0000000000000004898587196589413, 1, 0, 0); 

但是使用這個矩陣，我不能夠旋轉的元素 - 我稍後將計算尺寸並應用。

所以問題是 - 如何旋轉一個元素超過359deg使用CSS 3矩陣變換？

Answer 1

矩陣在CSS 3限定

從一個數學映射座標系到另一

（W3C reference）

這意味着720deg是完全等同於360deg爲你指出出。所以你不能直接用矩陣做到這一點。

然而，這種語法應爲您的工作需要：

div:hover { 
    transform: scale(1.5,1.5) rotate(720deg); 
    transition: transform 3s; 
}