微信h5插入视频的一些坑

安卓下微信h5中的video同层播放：
x5-video-player-type=’h5’ 安卓下开启同层播放（ios本来就支持同层播放的）
x5-video-player-fullscreen=’true’ //安卓下设置此属性后 可以通过窗口变动事件来设置视频尺寸 设置视频尺寸后会等比缩放 超出屏幕后会自动裁切
style=’object-position:0 0;’ 安卓下设置视频播放后 左上角的位置

ios下 onclick事件来调用视频的play() 无效；需要用 ontouchstart事件来调用play();

安卓播放完视频后 需要在去播放一个音频文件来回到页面

ios在设置视频层的display：block后 再去play() 视频无法播放，需要改成fadeIn(0,function(){video.play()})

<!-- x5-video-player-type='h5' x5-video-player-fullscreen='false' style='object-position:0 0;'  x5-video-player-fullscreen='false'    -->
<div class="videoBox">
    <video id="video" src="1.mp4" webkit-playsinline="true" playsinline="true" preload="auto" x5-video-player-type='h5' x5-video-player-fullscreen='true'  style='object-position:0 0;'></video>
</div>
<div style='position:absolute;left:0;top:0;width:100px;height:100px;background:#900;opacity:0.5;'></div>


<script>
window.onload=function(){
	var box = $('.videoBox');
	var mp4 = document.getElementById('video');

	window.onresize = function(){

		//mp4.style.width = window.innerWidth*.5 + 'px'
		//mp4.style.height = window.innerHeight*.5 + 'px'

		mp4.style.width = 300 + 'px'
		//mp4.style.height =800 + 'px'

	}

	document.documentElement.ontouchstart = function(){
		mp4.play();
	}


	mp4.addEventListener('ended',function(){
		//mp4.pause();
		//box.fadeOut(0);
		//box.remove();
		//var music_alert = new Audio('bj.mp3');
		//music_alert.play();
	},false);





}
</script>