ページのスクロールに応じて任意の要素にアニメーションエフェクトを付与できる非依存の軽量ライブラリ・「ScrollOut」

ScrollOut

See the Pen Cascading text effects w/ Splitting + ScrollOut ✍️🤓 by kachibito (@kachibito) on CodePen.

ScrollOutはページスクロールに応じたアニメーションエフェクトを任意の要素に与えるライブラリです。非依存で圧縮版なら1kbほどと非常に軽量なライブラリとなっています。Animate.cssとの併用も出来るみたいですね。個人的にはこちらの方法が凄く楽そうでした。

ScrollOut({
  onShown(el) {
    el.classList.add("animated");
  }
});

軽量、非依存で機能もなかなか充実してるので扱いやすそうでした。ライセンスはMIT。

ScrollOut