HTML5視頻無法在Chrome和Safari上自動播放

有誰能告訴我爲什麼這個HTML5視頻不工作？它在Firefox中正常工作，但在Safari或Chrome中無法正常工作。似乎無法弄清楚發生了什麼事。HTML5視頻無法在Chrome和Safari上自動播放

這是我正在處理的頁面http://www.adventures.org/trips/?prg=passport&new=design。

該視頻背後的大護照標誌。

這是視頻代碼。

<video autoplay loop muted class="fillWidth"> 
 
    <source src="http://adventures.org/trips/video/PassportHeader.mp4" type="video/mp4" /> 
 
    <source src="http://adventures.org/trips/video/PassportHeader.webm" type="video/webm" /> 
 
       Your browser does not support the video tag. I suggest you upgrade your browser. 
 
</video>

感謝所有的建議！我終於弄明白了。視頻編解碼器遇到了位於我的頁腳的Facebook API問題。

來源

2015-12-14 justincron

我建議增加一個第三視頻類型，.OGG檢查。我相信這實際上會在各種瀏覽器中正確地覆蓋你。 – Brant

感謝您的建議@Brant。我已經添加了.ogg，但沒有任何區別。我可以將代碼從這個頁面複製出來，然後放到任何其他頁面中，並且工作正常。在這個網頁上的東西正在殺死視頻... – justincron

顯示代碼..please .. – scaisEdge

我的猜測是瀏覽器與您設置的兩個來源混淆。試試這個：在這個http://caniuse.com/#feat=video

<video autoplay loop muted class="fillWidth"> 
    <source src="http://adventures.org/trips/video/PassportHeader.mp4" type="video/mp4" /> 
</video>

來源

2015-12-14 22:06:40

我試過這個，它也不起作用。 – justincron

嘗試檢查canuse視頻標籤似乎有一些問題，在Safari瀏覽器的編解碼器webm

在IE9 +和Safari/MacOSX的將工作提供的用戶已安裝WebM 編解碼器。部分支持表示至少支持一種編解碼器，但不是全部支持。

內部筆記和重點問題http://caniuse.com/#feat=webm

來源

2015-12-14 22:09:37 scaisEdge

如果Safari遇到webm問題，不應該回到mp4嗎？我想會這樣。 – justincron

看看你是否需要一個正確的編解碼器，我認爲在canuse中有一個參考，如果我的答案是有用的，請評價它 – scaisEdge

HTML5視頻無法在Chrome和Safari上自動播放

回答

相關問題