html5播放器，炫酷H5播放器VIDEO

html5播放器，炫酷H5播放器VIDEO还有进入全屏和退出全屏部分：事件监听部分：其一，在iOS中禁止全屏播放，需要在video标签加入属性 webkit-playsinline；其二，在微信浏览器中，由于微信浏览器内核设置原理，需要添加属性x5-video-player-type="h5" x5-video-player-fullscreen="true"对应特殊属性来解决禁止全屏不起效的bug，另外需要设置object-fit: fill;来避免上下黑色部分。初始各对象

什么也不说，先上设计出来的效果图！

VIDEO CSS3效果图

如今HTML5已成网页、APP应用等开发炙手可热的一门技术，而视频播放器VIDEO也是其中一大亮点。在开发相关应用时，可能经常遇到video不兼容或其他疑难杂症的情况，但对症下药，问题也能迎刃而解。且看如下视频播放器VIDEO设置部分代码：

上面部分代码，几个值得注意的部分：

其一，在iOS中禁止全屏播放，需要在video标签加入属性 webkit-playsinline；

其二，在微信浏览器中，由于微信浏览器内核设置原理，需要添加属性x5-video-player-type="h5" x5-video-player-fullscreen="true"对应特殊属性来解决禁止全屏不起效的bug，另外需要设置object-fit: fill;来避免上下黑色部分。

初始各对象

事件监听部分：

还有进入全屏和退出全屏部分：

进入全屏代码

退出全屏代码

IOS上全屏控制时需要注意，需要移除或添加回对应控制属性，否则无效。

由于全部代码较长，无法一一显示，如需要了解全部代码，请关注我。