なぜ私のアニメーションが再開時に極端に遅く行くのですか？

Question

私は「マーキー」効果の種類を生成するための容器に「scrollLeft」をアニメーション化するjQueryのアニメーションを持っています。

私はそれはそれはアニメーションを停止し、マウスの脱退に、それが再開コンテナのマウスオーバーでそう設定しています。

$(banksContainer).mouseover(function() {
    $(banksContainer).stop(false);
});

$(banksContainer).mouseleave(function() {
    startAnimation();
});

私はアニメーションをオフその後、アニメーションの上にマウスを移動するたびに

は、の非常にのゆっくりした速度で再開したが、徐々に分程度後に拾っています。

なぜ、この出来事があり、それを解決することができますか？

PS。ここで要求されるようにstartAnimation機能があります：

// recursive function - represents one cycle of the marquee
function startAnimation() {
    $(banksContainer).animate(
        { scrollLeft: scrollLeftEnd },
        35000,
        "linear",
        function() {
            $(this)[0].scrollLeft = scrollLeftHome;
            startAnimation();
        }
    );
}

Answer 1

アニメーションを再開したとき、カバーまでの距離が減少しているので、それはおそらくですが、時間が35秒のままです。スピード=距離/時間以来、それが遅くなります。

私はあなたの残りの距離に比例した時間を設定すべきだと思います。これは、35000 *距離残り/総距離になります。

このような何か？

function startAnimation() {
    $(banksContainer).animate(
        { scrollLeft: scrollLeftEnd },
        35000 * this.scrollLeft() / scrollLeftEnd, //or scrollLeftHome whichever is non-zero
        "linear",
        function() {
            $(this)[0].scrollLeft = scrollLeftHome;
            startAnimation();
        }
    );
}