啟動CSS動畫JavaScript

Question

如何用js啟動CSS動畫？ 第一行（webkitAnimation）有效但其他行則無效。

anim_logo.style.webkitAnimation="threesixty 3s";
anim_logo.style.mozAnimation="threesixty 3s";
anim_logo.style.oAnimation="threesixty 3s";
anim_logo.style.animation="threesixty 3s";

為什么？

實時預覽 （點擊Ninja Star）

Answer 1

您最好使用該動畫創建一個單獨的類，並在需要時將其附加到您的元素：

anim_logo.setAttribute("class", yourAnimationClass);

UPDATE

要刪除新添加的類，可以使用延遲函數：

function animateMe() {
    anim_logo.setAttribute( "class", yourAnimationClass );
    setTimeout( function() {
        anim_logo.setAttribute( "class", "" );
    }, 3000);
}