HTMLVideoElement.requestPictureInPicture()

HTMLVideoElement 接口提供的 requestPictureInPicture() 方法会发出异步请求,并以画中画的模式显示视频。

该方法不能保证视频进入画中画。如果授予了进入画中画的权限,则将返回一个 Promise,最终完成后将收到一个 enterpictureinpicture 事件,来表示它现在处于画中画状态。

语法

js
requestPictureInPicture()

返回值

PictureInPictureWindow 对象将由 Promise 最终完成后获得。可以用于监听用户何时调整该浮动窗口的大小。

示例

本示例请求视频进入画中画模式,并设置事件监听以处理窗口大小的调整。

js
function enterPictureInPicture() {
  videoElement.requestPictureInPicture().then((pictureInPictureWindow) => {
    pictureInPictureWindow.addEventListener(
      "resize",
      () => onPipWindowResize(),
      false,
    );
  });
}

规范

Specification
Picture-in-Picture
# request-pip

浏览器兼容性

BCD tables only load in the browser

参见