【jQuery】animateメソッドとは

animateメソッドとは

animateメソッドは、jQueryライブラリのアニメーション効果を適用するためのメソッドです。このメソッドを使用すると、要素のスタイルプロパティをアニメーションさせることができます。具体的には、要素の位置、サイズ、透明度、色などのスタイルプロパティを変更して、スムーズなアニメーション効果を実現します。

基本的な構文と書き方

$(セレクタ).animate({'プロパティ':'値'}, アニメーション速度);

アニメーション速度はミリ秒で指定するか、slowやfastといった文字列で指定することができます。例えばfont-sizeを変更したい場合は以下のように記述します。

//js
$('h1').animate({
    'font-size':'50px'
},2000);

また、CSSの値だけでなく、scrollTopなどの値も変更できます。
例えば、スクロールにアニメーションをつける場合は、$('html, body').animate({'scrollTop': 0}, 時間);のように指定します。

//js
$('html, body').animate({
    'scrollTop': 0
}, fast);