JavaScript 取消动画

示例

要取消对的调用requestAnimationFrame,您需要从上次调用时返回的ID。这是您用于的参数cancelAnimationFrame。下面的示例启动一些假设的动画,然后在一秒钟后将其暂停。

// 存储从每次对requestAnimationFrame的调用返回的id
var requestId;

// 画点东西
function draw(timestamp) {
    // 做一些动画
    // 请求下一帧
    start();
}

// 暂停动画
function pause() {
    // 传递上一次对requestAnimationFrame的调用返回的ID
    cancelAnimationFrame(requestId);
}

// 开始动画
function start() {
    // 存储从requestAnimationFrame返回的ID
    requestId = requestAnimationFrame(draw);
}

// 现在开始
start();

// 一秒钟后,暂停动画
setTimeout(pause,1000);