HTML vdieo 自動播放功能無法在 iOS (Safari) 中正常運行
如果要在 HTML 中播放影片,並且當作背景,一進來就自動播放,通常我們使用 video tag ,可以參考 https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/video ,通常長得像是
<video autoplay poster="posterimage.jpg"> <source src="video.mp4" type="video/mp4"> </video>
其中如果你要正常在各個瀏覽器中正常的「自動播放」,要加入 muted ,因為現在的瀏覽器的安全規範,都是只能自動播放無音軌的影片
<video autoplay muted poster="posterimage.jpg"> <source src="video.mp4" type="video/mp4"> </video>
那很多人會發現,ios 上面的設備有問題,因為在 ios 上面還有自己的規範,https://developer.apple.com/documentation/webkit/delivering_video_content_for_safari#3030250 ,主要就是講要加入 playsinline 屬性來定義影片的行為
<video autoplay muted playsinline poster="posterimage.jpg"> <source src="video.mp4" type="video/mp4"> </video>
到此為止就都可以正常在各個設備上使用
近期留言