資訊專欄INFORMATION COLUMN
If you have used audio or video, I guess you probably know autoplay attribute. Sometimes, PM wants to use that. However, the browsers doesn"t want that.
When I was using autoplay on 2018.10, I find that safari and chrome disabled autoplay when user haven"t interacted with the page, especially on safari mobile. It"s annoying.
So, if you want to use autoplay it may fail. So, some guys choose to play the audio when user click or touch the page. But I think the better way is to detect whether the user"s browser support autoplay. And the way is:
audioEl
.play()
.then(res => {
//not disabled
})
.catch(er => {
//disabled
})
However, ie11 and edge before 2018.1 returns undefined when audio.play(). So, if you care about that, you may try:
let audioState = audioEl.play()
if (audioState !== undefined) {
audioState
.then(res => {
//not disabled
})
.catch(er => {
//disabled
})
}
//other logic? what are you gonna do?
Original Post
ReferenceAutoplay Best Practices with Video.js
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/99526.html
If you have used audio or video, I guess you probably know autoplay attribute. Sometimes, PM wants to use that. However, the browsers doesnt want that. When I was using autoplay on 2018.10, I find tha...
摘要：?jiǎn)栴}場(chǎng)景制作一個(gè)，需要微信打開后背景音樂或者其他音頻文件進(jìn)行播放，但是經(jīng)常出現(xiàn)的結(jié)果是，安卓基本沒有問題，但是蘋果手機(jī)確不行，總是不進(jìn)行播放，這是為什么呢問題原因蘋果為了用戶著想，禁止了和加載播放。 問題場(chǎng)景： 制作一個(gè)H5，需要微信打開后背景音樂或者其他音頻文件進(jìn)行播放，但是經(jīng)常出現(xiàn)的結(jié)果是，安卓基本沒有問題，但是蘋果手機(jī)確不行，總是不進(jìn)行播放，這是為什么呢？ 問題原因： 蘋果為了...
摘要：偵聽到事件后處理事件的函數(shù)。偵聽器在偵聽時(shí)有三個(gè)階段捕獲階段目標(biāo)階段和冒泡階段。順序?yàn)椴东@階段根節(jié)點(diǎn)到子節(jié)點(diǎn)檢查是否調(diào)用了監(jiān)聽函數(shù)目標(biāo)階段目標(biāo)本身冒泡階段目標(biāo)本身到根節(jié)點(diǎn)。播放中常用的時(shí)間處理哦歌曲已經(jīng)載入完全完成緩沖至目前可播放狀態(tài)。 文章目錄： audio常用屬性 audio音樂格式的支持 audio屬性 參數(shù)說明 最近在搞audio方面的h5頁面，遇到一些坑，希望這篇文章對(duì)大...
閱讀 1371·2021-09-30 09:55
閱讀 1895·2021-08-27 13:10
閱讀 2243·2019-08-29 17:22
閱讀 1297·2019-08-29 16:30
閱讀 3463·2019-08-26 18:37
閱讀 2348·2019-08-26 11:47
閱讀 1162·2019-08-23 14:44
閱讀 1740·2019-08-23 13:46
