使背景图像淡入并继续向左移动

Question

我有这个整洁的jQuery slider，我希望图像在渐渐消失时从右向左缓慢滑动。

在查看jQuery时，我看到了这一点：

switch(effect){
    case 'fade':
    $new.css({'z-index':zPos,'top':'0','left':'0','display':'none'}).fadeIn(speed);

现在我想让图像在淡入时不断向左滑动，直到下一张图像出现。

$new.animate({
    left: parseInt($new.css('left'),10) == 0 ?
    -$new.outerWidth() :
    0
});

如果我将此附加到淡入淡出，则图像仅在幻灯片的持续时间加上轮播的持续时间后向左滑动。换句话说，在图像切换之前，它向左滑动。另外，我想控制速度，因为转换应该非常慢。

如何使图像不断向左滑动，就好像它是一种不停的流体运动一样？

Answer 1

我强烈建议您使用GreenSock (GSAP) v12来制作动画效果。使用timelineMax功能排队多个动画并同时播放它们而不是一个接一个地播放它们。它比jquery的动画更加灵活。它可以让你完全控制并使用jquery。