HTML video标签视频关闭画中画控件按钮

Web前端开发 / 8064 次阅读

HTML5 标签 video 在网页中插入播放视频，默认会出现画中画按钮控件，webkit 内核的浏览器（chrome）可以使用 video 新增的 disablePictureInPicture 属性关闭， firefox 浏览器目前不支持 disablePictureInPicture 属性，暂时也没有在代码层面关闭画中画的方法，需要在浏览器本身的设置里关闭，而IE浏览器压根就不支持画中画，不用考虑。

webkit内核浏览器关闭画中画 

<video src="video.mp4" width="500px" height="400px" controls disablePictureInPicture>
    您的浏览器不支持 video 标签。
</video>

或者直接不要控件 

<video src="video.mp4" width="500px" height="400px">
    您的浏览器不支持 video 标签。
</video>

当然，不要 controls 属性的话，播放、暂停、进度条等东西都没有了。

firefox浏览器关闭画中画

1、点击浏览器右上角的disablePictureInPicture-01.jpg按钮，再点击“选项”菜单

2、在“常规”菜单中找到“浏览”部分，把“启用画中画视频控件(E)”的勾去掉即可

disablePictureInPicture-02.jpg