スクロールアニメーションの実装を手助けするプラグイン ScrollTrigger の使い方 | ARAKAZE NOTE

ScrollTrigger 今回ご紹介するScrollTriggerは、スクロールアニメーションを実装したいときに便利なJavascriptプラグインです。jQueryなどは必要なくこれ単体で動きます。 このプラグインがやってくれることはざっくりまとめるとこんな感じです。 スクロール量と対象オブジェクトまでの距離を計測して、 オブジェクトが表示範囲に入ったらvisibleのclassを追加、 オブジェクトが表示範囲外に出たらinvisibleのclassに変える。 このclassの切り替えに対してtransitionなどを使ってアニメーションを付けていきます。 用意するもの まずはGitHubからプラグインを手に入れましょう。 最低限必要なのはScrollTrigger.min.jsのみです。そして、Javascript側で記述するのは基本的には下記のinitのみのようです。 <scrip

[kenichirou1225]

“ScrollTrigger”