您好,登錄后才能下訂單哦!
這篇文章給大家分享的是有關html5如何實現自動播放mov格式視頻功能的內容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
1、首先網站要支持.MOV格式文件
就是說,網站要能識別.MOV格式文件。
<mimeMap fileExtension=".mov" mimeType="video/quicktime" />
如何識別?設置MIME類型。以IIS為例。除了可以在IIS界面上直接設置,還可以在項目的web.config里設置。給個完整的例子
<?xml version="1.0" encoding="UTF-8"?> <configuration> <system.webServer> <directoryBrowse enabled="true" /> <defaultDocument> <files> <remove value="default.aspx" /> <remove value="iisstart.htm" /> <remove value="index.html" /> <remove value="index.htm" /> <remove value="Default.asp" /> <remove value="Default.htm" /> </files> </defaultDocument> <staticContent> <remove fileExtension=".mp4" /> <remove fileExtension=".wasm" /> <remove fileExtension=".woff" /> <remove fileExtension=".woff2" /> <remove fileExtension=".mov" /> <mimeMap fileExtension=".mp4" mimeType="video/mpeg" /> <mimeMap fileExtension=".wasm" mimeType="application/wasm" /> <mimeMap fileExtension=".woff" mimeType="application/font-woff" /> <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" /> <mimeMap fileExtension=".mov" mimeType="video/quicktime" /> </staticContent> <httpProtocol> <customHeaders> <add name="Access-Control-Allow-Origin" value="*" /> </customHeaders> </httpProtocol> <caching> <profiles> <add extension=".png" policy="CacheUntilChange" kernelCachePolicy="CacheUntilChange" /> <add extension=".jpg" policy="CacheUntilChange" kernelCachePolicy="CacheUntilChange" /> <add extension=".css" policy="CacheUntilChange" kernelCachePolicy="CacheUntilChange" /> <add extension=".js" policy="CacheUntilChange" kernelCachePolicy="CacheUntilChange" /> </profiles> </caching> </system.webServer> </configuration>
2、HTML
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <style> body,center{ padding:0; margin:0; } </style> </head> <body> <center> <video id="video" width="640" height="480" muted controls autoplay="autoplay" preload="auto" > <source src="月半灣.mov" /> 您的瀏覽器不支持 HTML5 video 標簽。 </video> </center> </body> </html>
本例會自動播放。自動播放的關鍵是“muted”屬性(靜音),否則無論是聲明autoplay=“autoplay”,還是用腳本video.play()都不起作用。這個應該是故意設計成這樣的。
感謝各位的閱讀!關于“html5如何實現自動播放mov格式視頻功能”這篇文章就分享到這里了,希望以上內容可以對大家有一定的幫助,讓大家可以學到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。