window.requestAnimationFrameメソッドの処理を中止(解除)する
window.requestAnimationFrameメソッドの処理を中止(解除)するには、window.cancelAnimationFrame
メソッドを使用します。
構文
window.cancelAnimationFrame(id);
引数名 | 型 | 説明 | |
---|---|---|---|
第一引数 必須 |
id | number | window.requestAnimationFrameメソッドにより返されたID値 |
サンプルコード
JavaScript
var i = 0;
var loop = function() {
var id = window.requestAnimationFrame(loop);
i++;
if (i === 1000) window.cancelAnimationFrame(id);
}
loop();
なお、window.cancelAnimationFrameメソッドはプレフィックスが必要であったりメソッド自体が未対応なブラウザがあるため、ポリフィルを用意するとよいかもしれません。
JavaScript
(function(w) {
w.cancelAnimationFrame = (function() {
return {
w.cancelAnimationFrame ||
w.webkitCancelAnimationFrame ||
w.mozCancelAnimationFrame ||
w.msCancelAnimationFrame ||
w.oCancelAnimationFrame ||
function(requestId) {
w.clearTimeout(requestId);
}
};
})();
})(window);
window.requestAnimationFrameについては、次の描画前に関数を実行するページをご覧ください。