video移动端兼容问题

video在各版本ios和安卓上面表现形式都有所区别,为了解决这一问题我在网上找了许多方法,看见甚至有采取重写控件的方式来解决,这里亲自尝试了一下,提供一个简单而又能解决大部分移动端兼容的方式:

给video加上 webkit-playsinline="" playsinline="" x5-playsinline="" x-webkit-airplay="allow"

<video id="mpVideo" width="100%" height="100%" webkit-playsinline="" playsinline="" x5-playsinline="" x-webkit-airplay="allow"
    src="{{{data.src}}}" controls="controls" preload="auto" poster="">
    您的手机不支持该视频文件!!!
</video>

webkit-playsinline和playsinline    规定视频播放时局域播放,不脱离文档流,这一属性需要是嵌入app或者webview之类的h5才会有效

x5-playsinline="" 在X5内核中让video标签播放不自动全屏,这也是解决大部分问题的核心代码

 

上一篇:静态集成腾讯TBS X5内核WebView,从微信提取新版30M浏览器内核打包进apk


下一篇:腾讯提供的TBS调试小程序页面