JavaScript:requestAnimationFrame 变得更快

标签 javascript

我有一个带有 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);

}

如何让它保持稳定、恒定的速度?

最佳答案

您可能多次调用 animation()(例如,每当单击按钮时)。

每次调用 animation() 都会开始一个新的重复 requestAnimationFrame() -> animation() -> requestAnimationFrame() -> animation() -> ... 序列。

E. G。如果你调用 animation() 两次,你有两个这样的序列在运行,你的帧速率将加倍。

在发送新请求之前,您需要取消当前正在进行的动画帧请求。参见 How to stop a requestAnimationFrame recursion/loop?

关于JavaScript:requestAnimationFrame 变得更快,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37797493/

相关文章:

javascript - 网页设计中的颜色燃烧混合模式

javascript - 将动态创建的输入中的值复制到文本区域

javascript - Google Charts,同时使用多个条形图和相关控件

javascript - 如何从使用 requireJS 构建的模块访问变量?

javascript - 如何添加多个语句

javascript - 用于多个字段的单个 jQuery 图像选择器

javascript - iframe 中网页的按键事件不起作用

javascript - 如何预览从 Canvas 中选择的正确图像?

javascript - 如何从 HTML 文件中分离出工具提示文本

javascript - 如何从 javascript 文件复制 href