資訊專欄INFORMATION COLUMN
摘要：需求當我們頁面上正在播放視頻或者播放背景音樂時，我們屏幕自動息屏或者切換程序去看消息時，我們希望暫停視頻或背景音樂，回到程序我們希望繼續(xù)播放視頻或播放背景音樂。
需求：當我們頁面上正在播放視頻或者播放背景音樂時，我們屏幕自動息屏或者切換程序去看消息時，我們希望暫停視頻或背景音樂，回到程序我們希望繼續(xù)播放視頻或播放背景音樂。
小程序上提供了 onUnload返回 onHide退出 onShow重新進入等生命周期，h5提供了一個visibilitychange，可以幫我們監(jiān)測這種情況。
document.addEventListener("visibilitychange", () => {
if (document.hidden) {
audio.pause()
video.pause()
} else {
setTimeout(() => {
bgMusic.play()
video.play()
}, 2000)
}
});
關于2s延時：在測試中發(fā)現(xiàn)，當回到頁面后100%會執(zhí)行else 但已知在IOS上只是息屏else里的play事件能執(zhí)行成功，但如果是點擊home鍵或者切換到其他程序則需要加2000延時才可以成功執(zhí)行播放事件。具體機制不太清楚，如果有哪位大神指導其中緣由請指教。
文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉載請注明本文地址：http://www.ezyhdfw.cn/yun/100300.html
摘要：問題描述這個倒計時按鈕，如果頁面在移動端切到后臺和切回來，倒計時停止運行。相關代碼為了兼容，切換到后臺繼續(xù)運行 問題描述 showImg(https://segmentfault.com/img/bVbiVSh);這個倒計時按鈕，如果頁面在移動端切到后臺和切回來，倒計時停止運行。但是在pc端沒有這個問題。倒計時代碼如下 let downCount = () => { ...
摘要：需求背景在最近的項目中，使用了和定時器實現(xiàn)了隨機走動物體的功能，走動的物體還會有的動畫。上述代碼中，維護了兩個數(shù)組，分別代表頁面進入可見狀態(tài)時需要執(zhí)行的回調列表和進入不可見狀態(tài)時需要執(zhí)行的回調列表。 需求背景 在最近的項目中，使用了transition和定時器實現(xiàn)了隨機走動物體的功能，走動的物體還會有animation的動畫。我發(fā)現(xiàn)在手機中，按home鍵或者切換應用，使頁面不在屏幕中，...
摘要：之前在做小程序的時候遇到一個問題小程序中有一個頁面，這個頁面中用嵌套了一個頁面，這個頁面中有背景音樂，背景音樂播放的情況下，點擊小程序右上角退出的小圓圈背景音樂仍然播放。 之前在做小程序的時候遇到一個問題：小程序中有一個webview頁面，這個頁面中用iframe嵌套了一個H5頁面，這個H5頁面中有背景音樂，背景音樂播放的情況下，點擊小程序右上角退出的小圓圈背景音樂仍然播放。 預期效果...
摘要：之前在做小程序的時候遇到一個問題小程序中有一個頁面，這個頁面中用嵌套了一個頁面，這個頁面中有背景音樂，背景音樂播放的情況下，點擊小程序右上角退出的小圓圈背景音樂仍然播放。 之前在做小程序的時候遇到一個問題：小程序中有一個webview頁面，這個頁面中用iframe嵌套了一個H5頁面，這個H5頁面中有背景音樂，背景音樂播放的情況下，點擊小程序右上角退出的小圓圈背景音樂仍然播放。 預期效果...
閱讀 720·2021-08-17 10:15
閱讀 1828·2021-07-30 14:57
閱讀 2049·2019-08-30 15:55
閱讀 2882·2019-08-30 15:55
閱讀 2762·2019-08-30 15:44
閱讀 733·2019-08-30 14:13
閱讀 2445·2019-08-30 13:55
閱讀 2648·2019-08-26 13:56
