我有一个 jquery 图像滑块,它设置为将图像-100% 向左移动。
当图像向左时:-100%;有没有办法让它回到循环的开始?
<div id="homeslider" class="firefly_slider_wrapper">
<div class="firefly_slider">
<ul id="ffslider">
<li class="slide">
<div class="slideplacment">
<img src="" name="0" />
</div>
</li>
<li class="slide">
<div class="slideplacment">
<img src="" name="1" />
</div>
</li>
</ul>
</div>
</div>
脚本如下所示:
jQuery(window).load(function(){
var tl2 = new TimelineMax({onComplete: upDatePosition});
var imgArray = [];
var imgLength = 0;
var photoContWidth = 0;
var imgWidth = 0;
n = jQuery("#ffslider li").length;
function setDefaults(){
imgLength = jQuery('#ffslider li').length;
photoContWidth = (imgLength * 100) + '%';
for(var i=0; i<imgLength; i++){
jQuery('#ffslider li').eq(i).attr('name',i);
jQuery('#ffslider li').eq(i).css('left', (i * 100) + "%");
imgArray.push(jQuery('#ffslider li').eq(i));
}
startAnimation();
};
function startAnimation(){
tl2.to(imgArray, 1, {left:'-=100' + '%', delay:3});
}
function upDatePosition(){
for(var i=0; i<imgLength; i++){
if((imgArray[i].css('left') <= -100 + '%')){
imgArray[i].css("left", (n - 1) * '100' + '%');
}
}
startAnimation();
}
setDefaults();
});
它是动态的并用于 WordPress 主题。