Animate.cssをページ読み込み時とスクロールに応じて表示したい

Question

現在以下のサイトを参考にして、スクロールに応じて表示することはできています。
https://into-the-program.com/website/scroll-animate-css.php

スクロール連動と別に、ページが表示されてアニメーションをさせる方法はありませんか？
また、

以下がコードです

$(window).on('load scroll', function(){

  //animatedのclassを持った要素をセレクタに指定
  var elem = $('.animated');

  elem.each(function () {

    //data属性からアニメーション名を取得
    var isAnimate = $(this).data('animate');
    //animated要素に位置を取得
    var elemOffset = $(this).offset().top;
    //現在のスクロールポジションを取得
    var scrollPos = $(window).scrollTop();
    //ウィンドウの高さを取得
    var wh = $(window).height();

    //animated要素がウィンドウ内の中央位置にきたら処理
    if(scrollPos > elemOffset - wh + (wh / 2)){
      $(this).addClass(isAnimate);
    }
  });

});

宜しくお願いします。

Answer 1

画面の描画が終わった後に処理を開始させたいのであれば、下記のような方法があります。

$(document).ready(function () {
 // 画面が読み込まれた後の処理を書く

});

Comments

[Unite-east]

回答有難うございます。

頂いたコードの中に質問のコードを記入すれば良いのでしょうか？？

[退会済みユーザー]

すでに書いてあるコードとは別に私が回答したブロックを追加し、コメントした部分に書きたい処理を追加してください。

[Unite-east]

有難うございます！