解决微信浏览器video视频自动播放的问题
<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 { }
你是什么样的人,便会遇到什么样的人;你想遇到什么样的人,就得先让自己成为那样的人。