制作移動端H5，需要添加視頻，點擊播放的時候會自動全屏播放，記錄一下處理局部播放的問題。
標(biāo)簽寫法：

<video id="pageVideo"
               x5-playsinline="true"             //安卓需要設(shè)置的屬性
               playsinline="true"                  //ios需要設(shè)置的屬性
               webkit-playsinline="true"       //ios10需要設(shè)置的屬性
               preload="auto"                      //預(yù)加載
               loop
               poster="images/shipin.jpg">  //預(yù)設(shè)未播放封面
            <source src="mp4/shipin.mp4" type="video/mp4">
  </video>

解決播放前視頻無封面黑屏問題
需要設(shè)置video寬度為1px，然后在視屏的div上放上遮罩
<div class="mask"><img src="1.jpg"></div>
點擊遮罩時讓其隱藏，同時給video加上css屬性

<script>
    var video = $("#pageVideo");
    $("video").on('click',function(e){
        $(".mask").fadeOut()
        $("#videoBox video").css("width","100%")
        video[0].play()
    });
    $(".mask").on('click',function(e){
        $(this).fadeOut()
        $("#videoBox video").css("width","100%")
        video[0].play();
    });
</script>

tips:安卓系統(tǒng)video界面控件無法取消，寬度無法充滿div的問題還沒解決。