jQueryのanimate()メソッドをもちいたアニメーション
jQueryのanimate()メソッドは、CSSの値を指定してアニメーションを表現します。
引数 | 説明 |
---|---|
properties | 型:PlainObject 最終的に変化させるCSSのキーと値のマップ値を指定します。 |
duration | 型:Number or String 初期値: 400 アニメーションする時間を指定します。 |
easing | 型:String 初期値: swing イージングの種類を指定します。 |
complete | 型:Function() アニメーションが完了した時に実行したい処理を指定します。 |
1500ミリ秒かけて、不透明度を1に変化するアニメーションです。
<div class="box1">
<img class="image1" src="https://choppydays.com/wp-content/themes/understrap-child/img/img_web_choppydays.png">
<div>
$box1 = $(".box1");
$box1.find( ".image1" ).animate({
opacity: 0.5
}, 1500 );