PictureInPictureWindow

Thuộc tính phiên bản

Giao diện PictureInPictureWindow không kế thừa bất kỳ thuộc tính nào.

PictureInPictureWindow.width Read only

Xác định chiều rộng của cửa sổ video nổi.

PictureInPictureWindow.height Read only

Xác định chiều cao của cửa sổ video nổi.

Phương thức phiên bản

Giao diện PictureInPictureWindow không kế thừa bất kỳ phương thức nào.

Sự kiện

Giao diện PictureInPictureWindow không kế thừa bất kỳ sự kiện nào.

resize

Được gửi đến PictureInPictureWindow khi cửa sổ video nổi được thay đổi kích thước.

Ví dụ

Cho một <button> và một <video>, khi nhấp vào nút, video sẽ vào chế độ picture-in-picture; sau đó chúng ta gắn sự kiện để in kích thước cửa sổ video nổi vào 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 = () => {
  video.requestPictureInPicture().then((pictureInPictureWindow) => {
    pictureInPictureWindow.onresize = printPipWindowDimensions;
  });
};

Thông số kỹ thuật

Tương thích trình duyệt

Xem thêm

• Picture-in-Picture API