Javascript 使requestAnimationFrame（）动画在不同选项卡上保持不变

使用requestAnimationFrame（）制作动画时，当您更改浏览器时，动画会持续，但当您更改浏览器中的选项卡时，动画不会持续。动画似乎暂停了

例如，此动画。

---

有没有一种方法可以使动画即使在您处于不同的选项卡中也能保持？

您的问题实际上并不是针对PIXI的。这是关于浏览器如何处理屏幕更新的问题

PIXI应用程序通常使用通用Javascript函数

Window.requestAnimationFrame（）

更新每个帧

切换选项卡时，此功能往往会暂停。从文档中：

在后台选项卡或隐藏窗口中运行时，回调速率可能会降低到较低的速率，以提高性能和电池寿命

---

所以简单的答案是否定的， 但是，通过跟踪更新之间经过的时间，并相应地向前移动动画，您可以轻松地对其进行模拟

在您提供的PIXI示例中，将

animate（）

函数更改为下面的代码，然后重新运行它。切换选项卡，当您切换回时，您将看到动画继续显示，就好像您从未切换过选项卡一样。希望有帮助！：）

---

你的问题实际上并不是针对PIXI的。这是关于浏览器如何处理屏幕更新的问题

PIXI应用程序通常使用通用Javascript函数

Window.requestAnimationFrame（）

更新每个帧

切换选项卡时，此功能往往会暂停。从文档中：

在后台选项卡或隐藏窗口中运行时，回调速率可能会降低到较低的速率，以提高性能和电池寿命

---

所以简单的答案是否定的， 但是，通过跟踪更新之间经过的时间，并相应地向前移动动画，您可以轻松地对其进行模拟

在您提供的PIXI示例中，将

animate（）

函数更改为下面的代码，然后重新运行它。切换选项卡，当您切换回时，您将看到动画继续显示，就好像您从未切换过选项卡一样。希望有帮助！：）

---

谢谢你，在进一步阅读之后，我得出了这样的结论：我必须想出一个方法来实现你所说的，我将删除这个帖子。现在我很高兴我没有。谢谢你提供的例子，这非常有帮助。谢谢你，在进一步阅读后，我得出结论，我必须想出一个方法来实现你所说的，我将删除这篇文章。现在我很高兴我没有。感谢您提供的示例，这非常有帮助。

var lastUpdate = new Date();
function animate() {
    //Determine the amount of time since last frame update
    var now = new Date();
    var elapsed = now - lastUpdate;
    lastUpdate = now;

    //Update the rotation based on time elapsed
    movie.rotation += elapsed/1000;

    // render the stage container
    renderer.render(stage);    
    requestAnimationFrame(animate);
}