单页上有多个jQuery插件实例

时间:2013-04-03 19:41:22

标签: jquery jquery-plugins cycle

我有一个单页,其中有一个缩略图'循环'库的多个实例。问题是我希望插件的这些实例以特定顺序开始并在设定的时间之后开始。他们每个人都只会经历一次转型。我可以设置某种间隔吗?

这是我的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
 });
});

1 个答案:

答案 0 :(得分:0)

感谢信息人员!

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