當畫布不可見時停止工作

我有一些JavaScript，它將一些數字處理並繪製到HTML5畫布上，從而創建一個動畫。當畫布不可見時，昂貴且連續的數字處理/繪圖毫無意義。因此，當用戶看不到畫布時（例如，因爲他們切換了選項卡或最小化瀏覽器或向下滾動或其他各種可能性），我想保留計算。當畫布不可見時停止工作

在JavaScript中，當畫布對用戶不可見時，暫停週期性定時器的好方法是什麼？（並且在畫布再次可見時恢復計時器。）

可能的幫助：請參閱滾動位置http://stackoverflow.com/questions/5036850/how-to-detect-page-scroll-to-a-certain-point-in-jquery – phenxd

可能的幫助：暫停setInterval http： //stackoverflow.com/questions/7279567/how-do-i-stop-a-window-setinterval-in-javascript – phenxd

在您的其他瀏覽器選項卡爲焦點的場景中，requestAnimationFrame非常理想 - 它會自動暫停選項卡焦點上的循環，並在選項卡焦點上自動恢復。

在您的滾動帆布屏幕之外VS窗口的.scrollTop（與&不高）的情況，你可以測試你的畫布的.scrollTop（與&不.height）。

爲了獲得兩種測試的好處，將.scrollTop測試放入requestAnimationFrame循環中。

2016-03-08 20:59:36 markE

回答