具體思路和實現(xiàn)如下：
html中將video標簽外包一層，

    <div class="videobox">
        <video id="mainvideo" webkit-playsinline="true" src="http://7xvl2z.com1.z0.glb.clouddn.com/nigg2.mp4"></video>
    </div>

初始樣式表如下：

html,body {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  -webkit-user-select: none; 
  user-select: none;
  overflow: hidden;
}

.videobox {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
}

video {width: 1px;display: blcok;}

/*
注：html萧诫，body里的overflow：hidden斥难，非常重要，不能省帘饶。
因為微信android的播放器是脫離DOM結構的蘸炸，也不會響應click、touch等事件尖奔。
如果視頻尺寸大了搭儒，會產生滾動條，必須在html和body加overflow：hidden提茁，
在videobox加沒用的淹禾。
*/

當視頻要播放時改變video的寬度（高度會等比縮放，即使自定義高度也是沒用的茴扁，會被忽略）

  var video = document.querySelector('#mainvideo');
  var videobox = document.querySelector('.videobox');

  //播放時改變外層包裹的寬度铃岔，使video寬度增加，
  //相應高度也增加了,播放器控件被擠下去峭火，配合overflow：hidden
  //控件看不見也觸摸不到了
  var setVideoStyle = function (){
    videobox.style.width = '120%';
    videobox.style.left = '-10%';
    video.style.width = '100%';
  }

當然上面這樣寫參雜了一些需求邏輯毁习，也可以直接樣式表就width:120%,或者更大；這個根據自己的需要來卖丸，但基本思路就是將播放器控件頂出視窗之外纺且，達到一種‘去除’、‘消失’的效果稍浆。連‘小窗’字樣也被頂出去了载碌，用過android或測試過的同學都知道點了小窗后會怎樣....（原版的即使去掉了播放器，但小窗字樣還在衅枫，不能算完全的隱藏播放控件吧）

相應產生的一些問題的解決辦法：

1嫁艇，視頻被放大了，畫面會被截掉一部分怎么辦弦撩？

這個可以在視頻輸出的時候兩邊和下邊留一些留白步咪，即留白可以沒用畫面黑色底，但又屬于視頻尺寸的一部分益楼，放視頻放大后猾漫，將主體畫面置滿視窗纯丸，被擠到外面都是留白的即可。

2静袖，視頻播放完畢后會中間自動出現(xiàn)播放控件按鈕

如果確實不想在播放完是出現(xiàn)一個按鈕，哪怕只有零點幾秒俊扭，就把視頻remove掉队橙，可以使用timeupdate監(jiān)聽視頻播放，用video.duration-video.currentTime的差值判斷是否快要結束了萨惑，在結束前零點幾秒提前remove掉捐康。

3，要是不是全屏視頻怎么搞庸蔼？

可以解总，思路是一樣的，將視頻控件頂出外層的包裹層姐仅，利用overflow：hidden花枫。只是全屏的外層包裹是body而已。

哦了掏膏，終于可以搞一個全屏視頻偽裝的東西了劳翰。

2017-03-21補
隨著時間的變遷，設備和技術的更新馒疹，本著不坑害同胞的心佳簸，負責任更新下還是有必要的
咱們還是從上面的4個要點來說ios和android吧

1. 全屏處理；

2. 自動播放颖变；

3. 播放控制生均；

4. 隱藏播放控件；

補充--全屏處理

ios加playsinline屬性腥刹，之前只帶webkit前綴的在ios10以后马胧，會吊起系統(tǒng)自帶播放器，兩個屬性都加上基本ios端都可以保證內斂到瀏覽器webview里面了衔峰。如果仍有個別版本的ios會吊起播放器漓雅，還可以引用一個庫iphone-inline-video（具體用法很簡單看它github，這里不介紹了朽色，只需加js一句話邻吞，css加點），
github地址是https://github.com/bfred-it/i...葫男，加上playsinline webkit-playsinline這兩個屬性和這個庫基本可以保證ios端沒有問題了（不過親測抱冷，只加這兩個屬性不引入庫好像也是ok的，至今沒有在ios端微信沒有出現(xiàn)問題梢褐，如果你要兼容uc或者qq的瀏覽器建議帶上這個庫）旺遮，
最后介紹個新的x5-video-player-type="h5"屬性赵讯，騰訊x5內核系的android微信和手Q內置瀏覽器用的瀏覽器webview的內核，使用這個屬性在微信中視頻會有不同的表現(xiàn)耿眉，會呈現(xiàn)全屏狀態(tài)边翼，貌似播放控件剝去了，至少加了這個屬性后視頻上層可以有其他dom元素出現(xiàn)了（非騰訊白名單機制的一種處理措施）鸣剪，

<video id="mainvideo" src="test.mp4" playsinline webkit-playsinline></video>

補充--自動播放

android始終不能自動播放组底，不多說。值得一提的是經測現(xiàn)在ios10后版本的safari和微信都不讓視頻自動播放了（順帶音頻也不能自動播放了）筐骇，但微信提供了一個事件WeixinJSBridgeReady债鸡，在微信嵌入webview全局的這個事件觸發(fā)后，視頻仍可以自動播放铛纬，這個應該是現(xiàn)在在ios端微信的視頻自動播放的比較靠譜的方式厌均，其他如手q或者其他瀏覽器，建議就引導用戶出發(fā)觸屏的行為操作出發(fā)比較好告唆。

//也可以在這個事件觸發(fā)后播放一次然后暫停（這樣以后視頻會處于加載狀態(tài)棺弊，為后面的流暢播放做準備）
document.addEventListener("WeixinJSBridgeReady", function (){ 
    video.play();
    video.pause();
}, false)

補充--播放控制

關于控制，這里僅補充一點吧擒悬，就是當?shù)谝淮尾シ乓曨l的時候ios端镊屎，如果網絡慢，視頻從開始播到能展現(xiàn)畫面會有短暫的黑屏（處理視頻源數(shù)據的時間）茄螃，為了避免這個黑屏缝驳，可以在視頻上加個div浮層（可以一個假的視頻第一幀），然后用timeupdate方法監(jiān)聽归苍，視屏播放及有畫面的時候再移除浮層

video.addEventListener('timeupdate',function (){
    //當視頻的currentTime大于0.1時表示黑屏時間已過用狱，已有視頻畫面，可以移除浮層（.pagestart的div元素）
    if ( !video.isPlayed && this.currentTime>0.1 ){
        $('.pagestart').fadeOut(500);
        video.isPlayed = !0;
    }
})

補充--隱藏播放控件

據說騰訊的android團隊的x5內核團隊放開了視頻播放的限制拼弃，視頻不一定調用它們那個備受詬病的視頻播放器了夏伊，x5-video-player-type="h5"屬性這個屬性好像就有點那個意思，雖然體驗還是有點...（導航欄也會清理）但至少播放器控件沒有了吻氧，上層可以浮div或者其他元素了溺忧，這個還是值得一提。
還有一點值得說的是盯孙，帶播放器控件的隱藏鲁森，

<div class="videobox" ontouchmove="return false;">
    <video id="mainvideo" src="test.mp4" x5-video-player-type="h5" playsinline webkit-playsinline></video>
</div>

比如這個videobox在android下隱藏，只用display：none貌似還是不行的振惰，但加個z-index:-1歌溉，設置成-1就可以達到隱藏播放器控件的目的了。這個經測可用且好用，可以一試痛垛。

好了就先補充能想到要說的這么多吧草慧，希望對大家有幫助