アニメーション：
指定classを順番にフェイド
特定のclassを指定して、順番にフェイドイン・アウトを行う。
String
対象とするclassを指定
Number1
透明度の変化量を指定 プラス値 = フェイドインになる ・ マイナス値 = フェイドアウトになる
Number2
Node間の遅延時間を指定 ms単位を想定
○0.5秒ずつずらすなら500 ○マイナス値にすると配列を降順で動かせる
○0.5秒ずつずらすなら500 ○マイナス値にすると配列を降順で動かせる
●必須引数 ●オプション引数(省略可能)
記述例
$aniDelayFade('aClass', 10, 300)
$aniDelayFade('aClass', -20, -250)
動作サンプル
フェイドアウト／フェイドイン／昇順／降順で動作するサンプル。
❶
❷
❸
❹
❺
HTML :
<div id="sample1">
<div class="sample1_item">❶</div>
<div class="sample1_item">❷</div>
<div class="sample1_item">❸</div>
<div class="sample1_item">❹</div>
<div class="sample1_item">❺</div>
</div>
Javascript :
$aniDelayFade('sample1_item',-5,250); //フェイドアウト：昇順
$aniDelayFade('sample1_item',20,150); //フェイドイン：昇順
$aniDelayFade('sample1_item',-30,-300); //フェイドアウト：降順
$aniDelayFade('sample1_item',25,-80); //フェイドイン：降順
※上記のサンプルコードは主にPC表示用を想定している。スマホ用のコーディングでは別途調整が必要となる可能性がある。
※この関数の動作サンプルとして必須ではない装飾的なCSSコードなどは省略して提示している。
※この関数の動作サンプルとして必須ではない装飾的なCSSコードなどは省略して提示している。