requestAnimationFrame和canvas切换tab页面的问题?

幽鬼兔
  • 181

在canvas里实现一个红包雨功能,不停地掉落红包(使用定时器每600毫秒掉落一次,每次最多掉落1-3个),但是如果我切换到其他标签页,过一段时间后回来会有一瞬间同时一堆红包从顶部开始下落???

这是为什么呢

回复
阅读 2k
2 个回答
✓ 已被采纳

因为在页面不可见时,requestAnimationFrame就会停止执行,setTimeout和setInterval也会节约性能,从小于1000ms的间隔,变为1000ms,导致绘画不正确。

在创建红包的时候,可以判断下页面可见性,若页面不可见时,则不进行创建。

if (document.visibilityState==='hidden' || document.hidden) {
    return;
}
宣传栏