0

サムネイル「サイクル」ギャラリーのインスタンスが複数ある単一のページがあります。問題は、プラグインのこれらのインスタンスを特定の順序で、設定した時間後に開始したいということです。そして、それぞれが 1 回だけ遷移します。ある種の間隔を設定できますか?

ここに私のHTMLがあります:

<figure role="container-1">
 <a href="#" class="singleFlip">
  <img src="/assets/img/1-img.jpg" border="0" />
  <img src="/assets/img/1-flipped.jpg" border="0" />
 </a>
</figure>

<figure role="container-2">
 <a href="#" class="singleFlip">
  <img src="/assets/img/2-img.jpg" border="0" />
  <img src="/assets/img/2-flipped.jpg" border="0" />
 </a>
</figure>

<figure role="container-3">
 <a href="#" class="singleFlip">
  <img src="/assets/img/3-img.jpg" border="0" />
  <img src="/assets/img/3-flipped.jpg" border="0" />
 </a>
</figure>

これが私のJSです:

$('.singleFlip').cycle({
    fx:      'turnRight',
    delay:   10000,
    speed:   500,
    timeout: 8000,
    autostop: 1
});

答え:

$('.singleFlip').each(function (i) {
 $(this).cycle({
  fx: 'turnRight',
  delay:   10000 * i,
  speed:   500,
  timeout: 8000,
  autostop: 1
 });
});
4

1 に答える 1