关于html5 video全屏+自定义控制器

最近整了台nas机，准备自己写个视频网站搭建家庭媒体服务。临时记录下h5 video全屏+自定义控制器的实现的方式，之后会针对实现完整的h5 video播放控制写一些介绍和遇到的坑。 video标签中有controls属性，如果controls=“controls” 则会使用浏览器内嵌的控制器，当然这是最省力的，而且实际使用也没什么问题，但对于喜欢从轮子造起的猴子，还是喜欢全部自定义。 简单的说，全屏用的不是video全屏，而是将div全屏。先入为主以为视频全屏，只有video具有全屏功能，结果搜索了各种video全屏+自定义控制器的方法，要么只有chrome能用，要么就是只有非全屏自定义控制器，全屏还是浏览器的控制器。。 div全屏和video全屏调用方法一样，或者说全屏功能是所有标签的方法，不是video专有的方法。

html

jQuery:

div全屏可以说是同时解决屏蔽浏览器全屏控制器，同时使用自定义的控制器。嵌套在被全屏的div里面的元素都会在全屏的时候显示，只用把自定义控制器和video共有父容器全屏就可以了。然后就是各种css调整布局。 顺便一提，有很多现成的插件可以实现全屏，自定义控制器这些，像是videojs。只是个人不喜欢而已，而且出bug了都不知道是哪里的问题。自己写的改起来反而得心应手。后面会打算出个造轮子的系列，慢慢讲做一个视频网站遇到的坑。