HTML5視頻在IE中無法播放?兼容方案與格式轉換教程

ie對html5視頻支持不佳主要因歷史遺留問題,解決方法包括:1.引入html5shiv.JS和respond.js兼容性庫;2.使用ffmpeg將視頻轉為h.264編碼的mp4格式;3.在網頁中提供mp4、webm和ogg多種格式供瀏覽器選擇;4.通過JavaScript檢測ie并強制加載mp4視頻源;5.使用video.js或plyr等插件提升兼容性。

HTML5視頻在IE中無法播放?兼容方案與格式轉換教程

HTML5視頻在IE中無法播放?別慌,這問題挺常見的。核心在于IE對HTML5的支持不夠全面,尤其是老版本。解決思路無非是兼容性處理和格式轉換。

HTML5視頻在IE中無法播放?兼容方案與格式轉換教程

解決方案

HTML5視頻在IE中無法播放?兼容方案與格式轉換教程

首先,明確問題根源。IE9以下版本對HTML5視頻標簽的支持幾乎為零。即使是IE10、IE11,也可能存在編碼格式上的兼容性問題。

立即學習前端免費學習筆記(深入)”;

第一步,引入兼容性庫。最簡單粗暴的方式是使用polyfill。html5shiv.js和respond.js這兩個庫可以解決IE對HTML5標簽的識別問題。在

標簽中加入以下代碼:HTML5視頻在IE中無法播放?兼容方案與格式轉換教程

<!--[if lt IE 9]>   <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>   <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script> <![endif]-->

注意,這段代碼必須放在條件注釋

? 版權聲明
THE END
喜歡就支持一下吧
點贊8 分享