Animate.css - 动画开始顺利，并在最后碰撞

Question

我有一个SPA，当使用Animate.css加载时，内容区域会向左淡入。

这项工作对几乎所有页面都很好，除了少数几个。 这几个行为不端的页面上的动画开始流畅，但最后会突然完成动画。

Answer 1

我不确切知道根本原因是什么，但是几页上的问题是加载页面的嵌套元素上的动画（再次是Animate.css）。

例如，当我加载页面“container”并且使用css动画在其中有另一个元素时，我将得到上述问题。

<div id="container" class="animated fadeInLeft">
    .... 
     ...
      <div id="nested" class="animated flipInX">

当我从嵌套元素中删除动画class="animated flipInX"时，容器会像所有其他页面一样平滑淡入淡出。

此问题的

解决方法：

• 通过javascript代码将动画类附加到嵌套元素：

  $("#nested").addClass("animated flipInY");

这适用于我的情况。