MENU
コンテンツ再構築中

JavaScript:jQueryイージングの確認用アニメーションとサンプルコード一覧

おなじみeasingのカーブの名称と動きを忘れがちなので、アニメーションサンプルをjQuery日本語リファレンスを参考にみやすくまとめました。

サンプルコードを出力しているので、コピーペーストで即使用が可能です。コーディング時にお役立て下さい。

INDEX

jQueryイージングのアニメーションサンプル

カーブの名称 or バー をクリックすればアニメーションが確認できます。(最初の読み込みに多少時間がかかります)

まとめ

easeInElastic はどこで使用するのでしょうか(笑)一般的には easeInQuad、easeOutQuad、easeInOutQuad あたりがよく使われていると思います。
動きが楽しいからといってやりすぎにはには注意し、節度をもって使用すればUX向上に一役買ってくれると思います。

この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

Please share it!
  • URLをコピーしました!
  • URLをコピーしました!
INDEX