Animate.css - アニメーションがスムーズに開始し、最後に向かってぶつかります

Question

Animate.cssを使用して読み込まれると、コンテンツ領域が左にフェードインするSPAがあります。

この作業は、ほんの少しのページを除いてほぼすべてのページで有効です。 このいくつかの誤ったページのアニメーションはスムーズに始まりますが、最後までアニメーションが突然終了します。

Answer 1

私は、根本的な原因が何であるかを正確に知りませんが、いくつかのページ上の問題がロードされたページ（再びAnimate.css）のネストされた要素のアニメーションでした。

たとえば、ページ「コンテナ」を読み込み、CSSアニメーションを使用してその内部に別の要素がある場合は、上記の問題が発生します。

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

私はネストされた要素からアニメーションclass="animated flipInX"を削除すると、コンテナは他のすべてのページのようにスムーズにフェードイン。この問題の

回避策：

• は、ネストされた要素（複数可）にJavaScriptコードを経由してアニメーションクラスを取り付けます

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

これは私の場合で働いていました。