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秒で。

以前と同じ速度で再起動する場合は、比例配分された時間を反映するために、2 番目のアニメーションの時間を短縮する必要があります。

覚えておいてくださいspeed = distance / time。再起動したアニメーションの移動距離が短くても同じ時間である場合、時間も比例して短縮しない限り、速度は遅くなります。

于 2012-08-25T01:11:52.647 に答える