如何使用 animate.css 将 2 个动画添加到一个 html 标签？

Question

我想使用 Dane Den 的 Animate.css 将 2 种不同类型的动画添加到我的 HTML 对象之一。 https://github.com/daneden/animate.css

这可以吗？

Answer 1

使用 css 而不是 classes 来执行此操作。如果您使用 classes，最后一个将覆盖其他 classes。

animation-name: animation1, animation2, animation3;

例如：

如果您想使用 bounce、flash 和 pulse，您可以编写自己的 class 来实现：

HTML

<div class="animated myAnimations"></div>

CSS

.myAnimations {
    animation-name: bounce, flash, pulse;
    -webkit-animation-name: bounce, flash, pulse;



    /*
    you can set different proporties to different animations too:
    1s to bounce
    2s to flash
    3s to pulse
    */

    animation-duration: 1s, 2s, 3s;
    -webkit-animation-duration: 1s, 2s, 3s;
}

Fiddle

如何使用 animate.css 将 2 个动画添加到一个 html 标签？

How to add 2 animations to one html tag using animate.css?

css

jquery-animate

animate.css