javascript - 开始 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";

为什么？

实时预览（点击忍者之星）

Answer 1

您最好使用该动画创建一个单独的类，并在需要时将其附加到您的元素：

anim_logo.setAttribute("class", yourAnimationClass);

更新

要删除新添加的类，您可以使用延迟函数：

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