国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

video標簽自動播放問題

Jeff / 1248人閱讀

摘要：臨時接了個非常緊急的首頁開屏廣告的活動，然后開始找源碼開始該以前的活動每年偶爾會有幾次這種活動都是直接套模板，然后因為相關人員都離職了，模板丟失，模板使用做的播放，但是有的瀏覽器判斷有問題，比如某狐，然后因為播放一個大屏的廣告視頻，所以決定

臨時接了個非常緊急的首頁開屏廣告的活動，然后開始找源碼開始該以前的活動（每年偶爾會有幾次這種活動都是直接套模板），然后因為相關人員都離職了，模板丟失，模板使用flash做的播放，但是有的瀏覽器判斷flash有問題，比如某狐，然后因為播放一個大屏的廣告視頻，所以決定用video標簽來直接做，然后發現了以下問題（本文章僅在mac上發現這個問題，windows未嘗試）

video標簽加上自動播放autoplay發現在chrome、火狐瀏等覽器上都不會自動播放

 var id = "narnia"
 var videoUrl = "http://xxxxx.mp4"
 var width = "1280"
 var height = "680"
 var tempHtml = ``

查了好多原因，發現是瀏覽的問題，因為video可能加載各種視頻，自動播放會有一定的不安全性。還有的說chrome怕聲音突然出來，嚇到你，不管是什么原因反正造成了以上問題反正就是不能播放

然后搜了一下解決方法，比如說去 chrome://flags/#autoplay-policy 設置成 no user gesture is required 就好了等等，我想說我一個用戶還要去設置這個那你還寫這個有什么用，用戶只關心好不好用而已

然后最后在其他的答案中找到一項，在視頻標簽中加上 muted 就可以，然后嘗試了一下的確是可以了，但是這個標簽是靜音，都靜音了那我的自動播放其實也沒啥用，然后查了各種其他解決辦法問了好幾個大神然后都沒有其他辦法，然后想了一下折中的辦法：

因為無法自動播放必須要求用戶去主動觸發播放才能播放，然后加上muted可以靜音自動播放

可以給用戶加一個靜音按鈕，然后這個靜音做的功能是取消靜音+播放

為什么要加上播放呢，因為你加上muted隨便自動播放了，但是你要把這個屬性取消了，會再次回到暫停，立馬取消播放

function openVoice() {
    var videoPlayer = document.getElementById("homeVideo")
    videoPlayer.muted = false
    videoPlayer.play()
}

這個方法先去關閉靜音，然后再調用了播放方法，這樣就算是用戶觸發了播放就可以正常播放了，這樣也算折中的解決了自動播放的問題，找了半天實在是沒有找到其他辦法，屬在下才疏學淺，如果其他人有好的解決辦法請指教！真心求教?。?！

ps. 加上muted就可以自動播放，看來瀏覽器怕聲音突然出來，嚇到你這個還是挺接近的

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/106764.html

相關文章

  • 關于 video 播放的新探索

    摘要：使用標簽這是關于給出的基本用例。其實我們也是在這種背景下研究出來新的技術問題解決清晰度無縫切換的。這樣之前說的所有成本問題都不存在，還能做到相同體驗的無縫切換。所有代碼來自帶解析器能節省流量的西瓜播放器 前端同學要使用 HTML5 播放器視頻，必然會使用 video 標簽，不過大多數同學只是使用了較簡單的功能，其實它本身擁有不凡之力有待我們發現。 首先，我們先來看下 video 最基礎...

    Shihira 評論0 收藏0

  • 手機瀏覽器自動播放視頻video（設置autoplay無效）的解決方案

    摘要：參考鏈接禁止自動播放后，有什么比較好的方法實現的自動播放嗎微信自動播放視頻可交互，設置層級，無控制條，非視頻下安裝系統安裝使用音視頻播放和常見的坑處理在微信和瀏覽器中不全屏播放解決 1、問題的提出 某一天接了個需求，需要在手機的H5頁面內加入視頻，我開開心心做完，準備交付的時候，問題來了，PM想要用戶一進入頁面，視頻就開始播放，不需要用戶手動點擊。 2、嘗試解決 加autoplay 視...

    fyber 評論0 收藏0

  • 手機瀏覽器自動播放視頻video（設置autoplay無效）的解決方案

    摘要：參考鏈接禁止自動播放后，有什么比較好的方法實現的自動播放嗎微信自動播放視頻可交互，設置層級，無控制條，非視頻下安裝系統安裝使用音視頻播放和常見的坑處理在微信和瀏覽器中不全屏播放解決 1、問題的提出 某一天接了個需求，需要在手機的H5頁面內加入視頻，我開開心心做完，準備交付的時候，問題來了，PM想要用戶一進入頁面，視頻就開始播放，不需要用戶手動點擊。 2、嘗試解決 加autoplay 視...

    UsherChen 評論0 收藏0

  • 手機瀏覽器自動播放視頻video（設置autoplay無效）的解決方案

    摘要：參考鏈接禁止自動播放后，有什么比較好的方法實現的自動播放嗎微信自動播放視頻可交互，設置層級，無控制條，非視頻下安裝系統安裝使用音視頻播放和常見的坑處理在微信和瀏覽器中不全屏播放解決 1、問題的提出 某一天接了個需求，需要在手機的H5頁面內加入視頻，我開開心心做完，準備交付的時候，問題來了，PM想要用戶一進入頁面，視頻就開始播放，不需要用戶手動點擊。 2、嘗試解決 加autoplay 視...

    Jinkey 評論0 收藏0

發表評論

0條評論

Jeff

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<