使用jQuery懸停觸發CSS3動畫不起作用

我想使用CSS3和jquery懸停一些圖標。反彈動畫附加到樣式表中的.bounce類;爲了處理懸停，我告訴Jquery在鼠標進入和離開圖像的父元素時分別添加和刪除bounce類。雖然jquery按預期工作，但動畫不是，我不知道爲什麼。使用jQuery懸停觸發CSS3動畫不起作用

Here's the fiddle.我很感激幫助。

來源

2012-09-06 ajw-art

如果你想更進一步：http://stackoverflow.com/questions/12062818/how-to-combine-jquery-animate-with-css3-properties-without-using-css-transitions –

你錯過了動畫持續時間：

.bounce {  
    // this is the shorthand definition 
    -webkit-animation: bounce 1s ease infinite; 
    -moz-animation: bounce 1s ease infinite; 
    -o-animation: bounce 1s ease infinite; 
    animation: bounce 1s ease infinite; 
}

http://jsfiddle.net/fyTpV/2/

來源

2012-09-06 22:30:05 Shmiddty

他正在使用別人的css我認爲。 Animated類具有這些值。它只需要放在elem上進行動畫製作。 –

這樣做！非常感謝。我假設爲我生成的CSS表格已經包含在其中。我以前從未使用過CSS3動畫，所以我甚至都沒有想過要檢查它。 –

您需要添加動畫類。這裏是更新的小提琴http://jsfiddle.net/fyTpV/3/添加類到你想要動畫的elem中，或者在你的添加類中添加動畫類。

來源

2012-09-06 22:38:00

使用jQuery懸停觸發CSS3動畫不起作用

回答

相關問題