PictureInPictureWindow

PictureInPictureWindow 接口不继承任何属性。

PictureInPictureWindow.width (en-US) 只读

获取浮动视频窗宽度。

PictureInPictureWindow.height (en-US) 只读

获取浮动视频窗高度。

The PictureInPictureWindow interface doesn't inherit any methods.

The PictureInPictureWindow interface doesn't inherit any events.

PictureInPictureWindow.resize (en-US)

Sent to a PictureInPictureWindow when the floating video window is resized. The associated event handler is PictureInPictureWindow.onresize (en-US).

Given a <button> and a <video>, clicking the button will make the video enter the picture-in-picture mode; we then attach an event to print the floating video window dimensions to the console.

const button = document.querySelector("button");
const video = document.querySelector("video");

function printPipWindowDimensions(evt) {
  const pipWindow = evt.target;
  console.log(`The floating window dimensions are: ${pipWindow.width}x${pipWindow.height}px`);
  // will print:
  // The floating window dimensions are: 640x360px
}

button.onclick = function() {
  video.requestPictureInPicture().then(pictureInPictureWindow => {
    pictureInPictureWindow.onresize = printPipWindowDimensions;
  });
};

• Picture-in-Picture_API