<video controls="controls" src="" id="video"
x5-video-player-type="h5"
preload="metadata"
playsinline="true" webkit-playsinline="true"
x-webkit-airplay="true"
x5-video-orientation="portraint"
x5-video-player-fullscreen="true">
</video>
1.playsinline=”true” webkit-playsinline=”true 解决ios自动播放全屏问题
2.x5-video-player-type=”h5″ x5-video-player-fullscreen=”true” 解决安卓同层级播放
3.ios微信下通过 WeixinJSBridgeReady 事件进行自动播放,这个方法在安卓微信浏览器不生效
//引入链接 <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script> //必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效 document.addEventListener("WeixinJSBridgeReady", function () { document.getElementById('video').play(); }, false)
4.最后安卓微信浏览器解决方法是触摸播放:
(这样ios还是自动播放,只有在安卓端微信浏览器是触摸播放)
//判断是否是Android端打开链接 if (navigator.userAgent.indexOf("Android") > 0) { //如果是Android的话,在判断是否是微信端打开链接 function is_weixn(){ var ua = navigator.userAgent.toLowerCase(); if(ua.match(/MicroMessenger/i)=="micromessenger") { return true; } else { return false; } } //如果是在Android端微信打开 触摸播放 if( is_weixn() ) { document.addEventListener('touchstart', function() { document.getElementById('bgVid').play() }) } else { }
原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/282500.html