怎樣實現H5微信播放全屏

<video
 id="videoALL" 
 src="video/01.mp4" 
 poster="images/1.jpg" /*視頻封面*/
 preload="auto" 
 webkit-playsinline="true" /*這個屬性是ios 10中設置可以
 讓視頻在小窗內播放，也就是不是全屏播放*/ 
 playsinline="true" /*IOS微信瀏覽器支持小窗內播放*/ 
 x-webkit-airplay="allow" 
 x5-video-player-type="h5" /*啟用H5播放器,是wechat安卓版特性*/
 x5-video-player-fullscreen="true" /*全屏設置，
 設置為 true 是防止橫屏*/>
 x5-video-orientation="portraint" /*播放器支付的方向，
 landscape橫屏，portraint豎屏，默認值為豎屏*/
 style="object-fit:fill">
</video>

<p id="videobox">
 <video 
 id="videoALL" 
 src="mp4.mp4" 
 poster="1.jpg" 
 preload="auto" 
 webkit-playsinline="true" 
 playsinline="true" 
 x-webkit-airplay="allow" 
 x5-video-player-type="h5" 
 x5-video-player-fullscreen="true" 
 x5-video-orientation="portraint"
 style="object-fit:fill">
 </video> 
 <p id="btn" onclick="playcontr()"></p>
</p>
<p id="videoend"><p id="againbtn" onclick="playcontr()"></p></p>

*{
 padding: 0;
 margin: 0;
 }
 #videobox{position: absolute;width: 100%;height: 100%;background-color: green;background-image: url(1.jpg);background-size: 100% 100%;background-position: top;overflow: hidden;}
 #videoALL{
 height: auto;
 position: absolute;
 width: 100%;
 top: 0;
 left: 0;
 object-fit: fill;
 display: block;
 background-size: cover;
 overflow: hidden;}
 #btn,#againbtn{width: 81px;height: 75px;position: absolute;top: 50%;left:50%;margin-top: -37.5px;margin-left: -40.5px;background-image: url(btn.png);background-size: 100% 100%;}
 #videoend{position: absolute;background-color: pink;display: none;background-image: url(2.jpg);background-size: cover;background-position: top;}

<script>
var videoALL = document.getElementById('videoALL'),
 videobox = document.getElementById('videobox'),
 btn = document.getElementById('btn'),
 videoend = document.getElementById('videoend');
var clientWidth = document.documentElement.clientWidth;
var clientHeight = document.documentElement.clientHeight;
videoALL.style.width = clientWidth + 'px';
videoALL.style.height = 'auto';
document.addEventListener('touchmove', function(e){e.preventDefault()}, false);
function stylep(pId){
 pId.style.width = clientWidth + 'px';
 pId.style.height = clientHeight +200+ 'px'; 
}
stylep(videobox);
stylep(videoend);
var u = navigator.userAgent; 
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android終端 
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios終端 
function playcontr(){
 if (isAndroid) {
 videoALL.style.width = window.screen.width + 'px';
 videoALL.style.height = window.screen.height + 'px'; 
 }
 videobox.style.display = "block";
 videoALL.play();
 btn.style.display = "none";
 videoend.style.display = "none";
};
videoALL.addEventListener('pause',function(){ 
 videoALL.style.width = clientWidth + 'px';
 btn.style.display = "block";
}) 
videoALL.addEventListener("ended",function(){
 videoALL.pause();
 videobox.style.display = "none";
 videoend.style.display = "block";
});
</script>