コード工房こみち

utils.toArray( )は、GSAPのメソッドのうちのひとつで、例えば複数の要素に同じアニメーションをつけたり、複数の要素に順番にアニメーションを適用したい時や、遅延を追加したいときなどに使うと便利です。記事中では、utils.toArray( )を使用したアニメーションの例も載せています。また、java scriptのquerySelectorAll() メソッドとの違いについても解説しています。

GSAPでは、timelineという、あらかじめ決められた順番でアニメーション処理を行うためのツールがあります。このツールを使用することで、アニメーションの順番やタイミングを簡単に管理することができます。もちろんタイムラインを使わなくてもア...

今日は .set() の使い方について説明します。.set() は、対象のプロパティを設定することができるメソッドです。アニメーションはありませんが、対象を配置する場所を設定することができます。継続時間０の .to() と同じ働きをするため...

今日はslowイージングのカスタマイズ方法についてです。アニメーションの途中で、まるでスローモーションになったかのような動きをつけることができます。基本の使い方このイージングを使用するためには、「EasePack」というファイルが必要です。...

今日はイージング「rough」のカスタマイズ方法について説明していきたいと思います。ジグザグで面白い動きが出せる「rough」。かなり細かいところまで自分でカスタマイズできるようになりますよ。基本の使い方このイージングを使用するためには、「...

今日は「expoScale」について詳しく説明していきたいと思います。基本の使い方このイージングを使用するためには、「EasePack」というファイルが必要です。公式サイトにインストールの方法が書かれているので、こちらを参考にファイルを取り...

今日はGSAPで使用できるイージングの種類について説明します。GSAPでは、様々な種類のイージングが用意されています。もちろん、自分でカスタマイズすることも可能ですが、今日はすでに用意されているイージングの種類についてみていきたいと思います...

tween（トゥイーン）とは、between（ビトゥイーン：２つのものの間に）から由来する言葉で、２つのイラストが変化しながら繋がるアニメーションのことをいうそうです。今日はこのトゥイーン特有のプロパティのデフォルト値を変更する方法について...

GSAPでは基本的に単位を省略して記述します。それは、デフォルトの単位が設定されているからです。では、デフォルトの単位以外を使用したいときはどうすればよいでしょう。今日はデフォルトの単位を変更する方法について説明します。デフォルトの単位につ...