更改索引时动画数组元素

时间:2014-02-11 12:33:08

标签: jquery arrays slideshow

我有一个包含4个jquery元素的数组。

<div class="wrapper">
 <img class="image">
 <img class="image">
 <img class="image">
 <img class="image">
</div>

在jQuery中:

var images = $('.image');

对于我的幻灯片效果(例如左侧的幻灯片)我做了类似的事情(这不是我的完整代码,幻灯片效果有效!)

$('.wrapper').prepend($('.image').last());
$('.wrapper').css('margin-left', '0px');
$('.wrapper').animate({'margin-left', '-100px'}, 1000);

我的包装纸向左滑动。现在,我想在幻灯片中转换我的图像。

if(images.index() === 0) {
  // some css for this image (I do my transformation width css transition)
} else if(images.index() === 1) {
  // do some other transformation with css
}

我在if内加了animate()(目前在complete内)。

所以我的包装器向左滑动,我的数组元素就像它们应该的那样转换,但仅限于幻灯片动画的END。我的滑动效果需要转换。

像:

while(images.index() >= 0 && images.index() <= 1) {// do transformation while this is true}