浏览器播放画中画,所有视频可以网页全屏,让视频可浮动、可缩放、可拖拽!

前言

最近在使用 Yandex 浏览器的时候有一个功能非常好用,那就是它可以自动将网页视频进行悬浮,从而你可以在浏览器任意标签页看视频,也就说所谓的“画中画”。这个功能 360 浏览器也有,又有一条理由让你别用 360 了?

不过,令人郁闷的是,Yandex 的画中画功能是有广告的,播放完视频之后会随机给你推荐视频,这点让人非常不爽。那么在别的浏览器能不能实现这个功能呢?

话不多说,3 2 0,我们开始吧~

 

功能说明

其实视频画中画功能,原 版 Chrome 在 70 版本之后就已经正式支持了。而且提供了 API 。

The Picture-in-Picture API allows websites to create a floating video window that is always on top of other windows so that users may continue consuming media while they interact with other sites or applications on their device.

画中画接口允许网站创建一个浮动的视频窗口,它总是在其他窗口的顶部,这样用户可以在与设备上的其他站点或应用程序交互时继续观看视频。

 

这个功能可以让我在浏览其他网页,甚至在使用其他软件的时候,浏览器的视频始终是置顶悬浮的。

 

不仅如此,悬浮的视频可以用鼠标任意更改大小。

 

还有一个功能就是,视频网页全屏。网页全屏的需求大概是想要大屏幕看视频,又不想遗漏任务栏吧。我用的少,但是肯定有人需要。

 

使用方法

这次先介绍了功能,再来说说怎么去实现。有两种方法,一种是直接安装 “悬浮浮画中画播放器” 这个扩展程序;而是装“油猴 TamperMonkey脚本扩展程序,再装视频网页全屏脚本。

在说方法之前先说一下为啥谷歌自己就支持这个功能还要用第三方工具。

chrome 开启画中画方法

打开 chrome://flags/#enable-picture-in-picture 后,将「Enable Picture-in-Picture(启用画中画)」选项由默认的「Default」设置更改为「Enabled」启用状态。

然后,在地址栏中执行chrome://flags/#enable-surfaces-for-videos——将「Enable the use of SurfaceLayer objects for videos.(为视频启用表层对象)」选项由默认的「Default」设置更改为「Enabled」启用状态。

 

然而这个画中画功能不是所有的网站都支持,所以我们需要用到第三方工具。

 

法一:悬浮浮画中画播放器

使用chrome提供的picture-in-picture api让直播以画中画模式播放。 目前支持斗鱼,虎牙,火猫直播以及各种使用html5播放器的网站。这个脚本基本上可以让所有H5播放器的视频可以悬浮画中画,但没有视频网页全屏功能。

安装方法

安装扩展。如果你可以直接上谷歌商店,可以点我前往安装。

如果不能,请前往附件下载 CRX 扩展。

 

法二:油猴脚本安装视频网页全屏

首先,安装油猴 TamperMonkey 扩展,如果你可以直接上谷歌商店,可以直接点我前往安装。

如果不能,请前往附件下载 CRX 扩展。

安装好脚本后,点我前往安装“视频网页全屏” 脚本。

1、画中画功能,默认快捷键F2。

2、网页中的任何一个一个视频网页全屏播放!

  • 支持有多个视频的任意网页(比如贴吧、论坛等)。支持复杂页面多层iframe嵌套的视频。支持HTML5视频。支持flash游戏。
  • 网页全屏后点浏览器最左边最右边按ESC都可以退出全屏。
  • 如果遇到HTML5播放器不显示网页全屏按钮或别的问题,尝试按ESC键缩放。

好了,本次分享就到这里。

 

Hey,你好哇。
影视剪辑 | AE | Pr | 电脑技术 | 摄影摄像 | 电影 | 电视剧 | 二次元
我们下次见

 

收集的所有资源均来自网络,仅供私下交流学习之用,任何涉及到商业目的的均不能使用,否则产生的一切后果由您自行承担,我们提供资源但是不对任何资源负法律责任,所有资源请在你下载后24小时删除。 如有侵权,联系 admin#mail.320nle.com
320印象 » 浏览器播放画中画,所有视频可以网页全屏,让视频可浮动、可缩放、可拖拽!

发表评论