DOM

Window.cancelAnimationFrame() メソッド

 編集:2022.09.12 by T.A.

window.requestAnimationFrame() の呼び出しによりスケジュールされたフレーム アニメーションのリクエストをキャンセルします。

構文
Window.cancelAnimationFrame(requestID)
Window Window
requestID window.requestAnimationFrame() の呼び出し時により返された ID 値。
戻り値

var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
                            window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;

var cancelAnimationFrame = window.cancelAnimationFrame || window.mozCancelAnimationFrame;

var start = window.mozAnimationStartTime;  // Firefox のみでサポート。他のブラウザーでは代わりに Date.now() などを使用してください。

var myReq;

function step(timestamp) {
  var progress = timestamp - start;
  d.style.left = Math.min(progress / 10, 200) + 'px';
  if (progress < 2000) {
    myReq = requestAnimationFrame(step);
  }
}
myReq = requestAnimationFrame(step);

cancelAnimationFrame(myReq);

テスト