H5 内嵌视频播放问题

今天做了一个微信活动的H5，要求是滑动页面触发视频播放，视频播放完后隐藏视频，显示落地页，另外要求，禁用系统播放器。

针对ios

1、这个方式是针对 ios有效（safari、微信都有效）。

2、playsinline属性针对ios 10以上系统有效。

3、webkit-playsinline属性针对ios10以下系统有效。

这是安卓的，不会自动全屏，但是会有滚动条

由于两者有较大的差别，所以为了方便我运用了个判断，来区分两个不同的系统

   var browser = navigator.userAgent;
     if (!!browser.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
        //ios
     }else{
         //Android
     }
   

触摸touch事件的监听

        document.addEventListener("scroll", touch, false);
        document.addEventListener('touchstart', touch, false);
        document.addEventListener('touchmove', touch, false);
        document.addEventListener('touchend', touch, false);
        function touch(e){
            
        }