jQuery animate.css 仅在 Firefox 上无法正常工作

Question

我几乎是 jQuery 的新手，我正在尝试使用一些在 Firefox 上运行良好的动画。

我正在使用 animate.css库并尝试将动画用于 slider 上的文本标题。

我正在使用 Soliloquy wordpress 插件 slider 。

独白 slider 添加了一个

.soliloquy-active-slide

到当前事件的幻灯片，所以我添加了 jQuery 以在事件幻灯片上添加动画类:

jQuery('#caption-1').on('.soliloquy-id-8 .soliloquy-active-slide').addClass('animated slideInLeft');

动画实际上在加载第一张幻灯片时工作，但当 slider 返回到第一张幻灯片时停止工作。

奇怪的是，这只发生在 Firefox 上，在 Chrome 和 Safari 中，动画在返回到第一个 slider 时继续运行。

更奇怪的是，动画确实在预期的 Firebug 调试器打开时工作。

我意识到我没有发布太多代码，但如果需要我可以提供更多。

任何帮助让它在 Firefox 上工作的人都会很棒。

干杯

Answer 1

如果你想让动画多次出现，你需要在动画结束后移除相应的类，如下:

    jQuery('#yourElement').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {
        jQuery(this).removeClass('animated slideInLeft');
    });

稍后你可以再次添加你想要的类......