0

我已经定义了一个函数来动画 7 个 div 到顶部。我尝试使用 stop(true, false) 函数来停止所有元素。并通过再次调用该函数重新启动动画。请看下面的代码。问题是我调用函数重新启动动画后动画变得非常慢。它慢了几秒钟，然后又恢复了正常速度。有谁知道原因。请帮忙！！！谢谢

我的代码附在下面

autoAnimate(5000);
$('#scroller_container').mouseenter(function(){
    $('#scroller .galleryThumb').stop(true, false);
});
$('#scroller_container').mouseleave(function(){
    autoAnimate(5000);
});

function autoAnimate(speed) {
    $('#scroller .galleryThumb:eq(0)')
        .animate({'top':'-122px'},speed,'linear',function(){
          if(!autoFlag) {
            index       = $('#scroller .galleryThumb:last').attr('id');
            index       = index.substr(5, index.length);
            index       = parseInt(index);
            index       = index + 1;
            autoFlag    = true;
          }
          if(index == numberOfAds) { index = 0; }

          $('#scroller .galleryThumb:eq(0)').remove();
          $('#scroller').append(adUnitContainer[index]);
          $('#scroller .galleryThumb:eq(6)').css('top','732px');
          index++;
          autoAnimate(speed);
    });
    $('#scroller .galleryThumb:eq(1)').animate({'top':'0px'},speed,'linear');
    $('#scroller .galleryThumb:eq(2)').animate({'top':'122px'},speed,'linear');
    $('#scroller .galleryThumb:eq(3)').animate({'top':'244px'},speed,'linear');
    $('#scroller .galleryThumb:eq(4)').animate({'top':'366px'},speed,'linear');
    $('#scroller .galleryThumb:eq(5)').animate({'top':'488px'},speed,'linear');
    $('#scroller .galleryThumb:eq(6)').animate({'top':'610px'},speed,'linear');
}
4

1 回答 1

0

如果你有一个 5 秒的动画并且你在中间停止它然后你用相同的动画终点重新开始相同的动画并告诉它运行 5 秒，它会变慢，因为它的距离更短在 5 秒内。

如果您希望它以与之前相同的速度重新启动，那么您必须减少第二个动画中的时间量以反映按比例分配的时间量。

记住speed = distance / time。如果您重新启动的动画的行驶距离较短但时间相同，则速度会较慢，除非您也按比例减少时间。

于 2012-08-25T01:11:52.647 回答