HTMLVideoElement: requestPictureInPicture() 方法
HTMLVideoElement 方法 requestPictureInPicture() 发出异步请求,将视频显示在画中画模式下。
视频不一定能进入画中画模式。如果授予了进入该模式的权限,则返回的 Promise 将会解决,并且视频会收到一个 enterpictureinpicture 事件,告知它现在已处于画中画模式。
语法
js
requestPictureInPicture()
参数
无。
返回值
一个 Promise,它会解析为一个 PictureInPictureWindow 对象,该对象可用于在用户调整此浮动窗口大小时进行监听。
异常
NotSupportedErrorDOMException-
如果该功能不受支持(例如,由于用户偏好设置或平台限制而被禁用)则抛出。
SecurityErrorDOMException-
如果该功能被 权限策略 (Permissions Policy) 阻止,则抛出。
InvalidStateErrorDOMException-
如果视频元素的
readState为HAVE_NOTHING,或者视频元素没有视频轨道,或者视频元素的disablePictureInPicture属性为true,则抛出。 NotAllowedErrorDOMException-
如果
document.pictureInPictureElement为null且文档没有 瞬时激活 (transient activation),则抛出。
安全
需要 瞬时用户激活 (Transient user activation)。用户必须与页面或 UI 元素进行交互,此功能才能工作。
示例
此示例请求视频进入画中画模式,并设置一个事件监听器来处理浮动窗口的调整大小。
js
function enterPictureInPicture() {
videoElement.requestPictureInPicture().then((pictureInPictureWindow) => {
pictureInPictureWindow.addEventListener("resize", () =>
onPipWindowResize(),
);
});
}
规范
| 规范 |
|---|
| 画中画 # request-pip |
浏览器兼容性
加载中…