以上为案例二维码第一个H5案例分析从头分析在iOS上，APP使用系统自带的浏览器渲染页面，视频播放视频的效果是统一的，只是需要考虑不同iOS版本是否存在不一致。在iOS上，播放视频时，默认会弹出播放器全屏播放视频，如下图。播放器顶部和底部有系统默认的控制条，可以控制播放进度、音量、暂停或继续播放视频。播放视频时，视频会在页面上“浮动”，页面上的所有元素只能在视频下方，这种效果显然不是我们想要的。不过还好，在iOS10Safari中，视频添加了playsinline属性，可以让视频内联播放。（微信浏览器支持）webkit博客中提到了关于playsinline属性的注释：该属性最近已添加到HTML规范中，WebKit通过取消其遗留webkit-playsinline属性的前缀来采用此新属性。自iPhoneOS4.0以来就支持这个遗留属性，并且根据我们更新的取消前缀策略，我们很高兴能够取消前缀webkit-playsinline。来源：http://www.cnblogs.com/zzsdre...Android实现：TBSKernel(>=036849)支持视频播放器调用同层播放器，这个不需要申请白名单，设置两个属性即可x5-video-player-type="h5"和x5-video-player-fullscreen="true"，播放效果结合IOS和Android下同层播放器的实现代码微信：让我们谈谈视频事件。本例不使用timeupdate时间来实现播放进度。在这种情况下，监视器需要意识到在播放第一个视频后，会出现一个选项供用户执行视频选择互动我们需要在选项出现时暂停视频画面，先看代码：functiongetTime(obj){obj.timer=setInterval(function(){vart=obj.currentTime;if(isAndroid){//选项出现if(Math.abs(t-32.13)<=.1&&istest){selectBtn.style.display='block';obj.pause();clearInterval(obj.timer);}////戴上太阳镜后played,bracelet一定是Playfinished,hatfinishedplayingif(Math.abs(t)>46.04&&typenum==1||Math.abs(t)>65.16&&typenum==2||Math.abs(t)>80.64&&typenum==4){selectBtn.style.display='block';obj.pause();istest=true;clearInterval(obj.timer);}}else{//选项出现if(Math.abs(t-32.13)<=.1&&istest){selectBtn.style.display='block';//obj.currentTime=32.13;obj.pause();clearI间隔（obj.timer）；}////墨镜必打，手镯必打，帽子必打if(Math.abs(t)>46.04&&typenum==1||Math.abs(t)>65.16&&typenum==2||Math.abs(t)>80.24&&typenum==4){selectBtn.style.display='块';obj.currentTime=32.13;obj.暂停（）；测试=真；clearInterval(obj.timer);}}//项链播放，提前调出点击按钮if(t>172){//aLink.style.display='block';//window.location.href='http://wag.i-h5.cn/dj/wyf/fenx.html';}},20);}/***视频开始播放*/video.addEventListener('play',function(){//ovstatus=1;console.log("play")getTime(this);},false);本例使用定时器，在触发视频开始事件时每20ms触发一次，判断当前视频进度，如果达到需要停止的进度（第一个segment片段播放时，或者optionsegment结束），视频暂停，出现浮层div块，为用户提供交互式点击选项，跳转到相应进度继续播放视频。以上就是本案要解决的主要问题。在Android浏览器的左上角会有一个返回按钮来启动播放。单击该按钮时，将退出播放。当退出播放时，我们需要做相应的处理。TBS提供了相应的事件，但是不同版本之间还是有一点区别的。TBS<036849036849<=TBS<036900036900<=TBS支持同层播放吗？对，当x5videoexitfullscreen进入全屏播放时触发x5videoenterfullscreen，触发x5videoexitfullscreenx5videoenterfullscreen通过监听这两个事件可以知道当前的播放状态document.getElementById('video').addEventListener("x5videoexitfullscreen",function(){alert(“退出全屏”）}）document.getElementById（“视频”）。addEventListener("x5videoenterfullscreen",function(){alert("enterfullscreen")})sendinthedialog//gettbs可以查看相关信息，tbsCoreVersion是当前安装的TBS内核版本。补充资料：H5视频播放优化：http://www.xuanfengge.com/htm...videoAPI：http://www.w3school.com.cn/ta...
