意外的行爲與CSS關鍵幀動畫

我想要一個元素從頁面加載0，但該元素需要旋轉。似乎是一個簡單的事情，但似乎在動畫完成後應用旋轉：意外的行爲與CSS關鍵幀動畫

@-webkit-keyframes scale{ 
    0%{-webkit-transform: scale(0);} 
    100%{-webkit-transform: scale(1);} 
} 
div{ 
    -webkit-transform: rotate(30deg); 
    -webkit-animation: scale 2s; 
}

http://jsfiddle.net/mildfuzz/wnpVp/

來源

2013-06-19 Mild Fuzz

或歌劇，不，你說得對。不知道這有什麼用處。 –

你用webkit創建了一個小提琴，現在firefox用戶必須先編輯它 – bugwheels94

這樣的東西？ http://jsfiddle.net/wnpVp/3/ – Adrift

您需要使用transform速記內的@keyframes規則，因爲你rotate()功能外規則，因此不會像你期望的那樣動畫。

http://jsfiddle.net/wnpVp/3

來源

2013-06-19 20:55:47 Adrift

意外的行爲與CSS關鍵幀動畫

回答

相關問題