JavaScript：requestAnimateFrameがより速くなる

Question

私はrequesetAnimationFrameでアニメーションを持っています。私はそれを再生すると、それが見えなくなるまで速くて速くなります。

function tirer(){ 

    var missile=document.getElementById("missile"); 
    var currt= missile.currentStyle ||window.getComputedStyle(missile); 
    if (parseInt(currt.bottom)<700) 
    missile.style.bottom=parseInt(missile.style.bottom)+20+"px"; 
    else 
    alert ("in top"); 


} 
function animation(){ 
    tirer(); 
    requestAnimationFrame(animation); 

} 

どうすれば安定した一定のスピードにすることができますか？

Answer 1

animation()に複数回（たとえば、ボタンをクリックするたびに）電話することがあります。

animation()を呼び出すたびに、新しい繰り返しrequestAnimationFrame()を開始 - >animation() - >requestAnimationFrame() - >animation() - > ...シーケンスを。

E.g。 animation()を2回呼び出すと、そのようなシーケンスが2回実行され、フレームレートが倍になります。

新しいリクエストを送信する前に、現在進行中のアニメーションフレーム要求を取り消す必要があります。 How to stop a requestAnimationFrame recursion/loop?