javascript - Proper way to pause animations when not in view

Question

I'm wondering whether there is a proper way to pause requestAnimationFrame animations when the user has scrolled and the animation is not in the view anymore?

requestAnimationFrame does this automatically when the browser displays another tab, but is it possible to do it when the user scrolls?

Answer 1

唯一的方法是将你的代码分成小函数块。

当您向下滚动时，请跟踪正在完成多少滚动。

您可以提供自己的自定义条件，并在函数已执行且未获得焦点后使用window.cancelAnimationFrame() 。

• 如何停止 requestAnimationFrame 递归/循环？
• https://developer.mozilla.org/en-US/docs/Web/API/window.cancelAnimationFrame