DocumentPictureInPictureEvent

Khả dụng hạn chế

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Giao diện DocumentPictureInPictureEvent của Document Picture-in-Picture API là đối tượng sự kiện cho sự kiện enter, được kích hoạt khi cửa sổ Picture-in-Picture được mở.

Event DocumentPictureInPictureEvent

Hàm khởi tạo

DocumentPictureInPictureEvent() Thử nghiệm

Tạo một phiên bản đối tượng DocumentPictureInPictureEvent mới.

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

Kế thừa các thuộc tính từ đối tượng cha, Event.

window Read only Thử nghiệm

Trả về một phiên bản Window đại diện cho ngữ cảnh duyệt web bên trong cửa sổ DocumentPictureInPicture mà sự kiện được kích hoạt.

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

Kế thừa các phương thức từ đối tượng cha, Event.

Ví dụ

js
documentPictureInPicture.addEventListener("enter", (event) => {
  const pipWindow = event.window;
  console.log("Video player has entered the pip window");

  const pipMuteButton = pipWindow.document.createElement("button");
  pipMuteButton.textContent = "Mute";
  pipMuteButton.addEventListener("click", () => {
    const pipVideo = pipWindow.document.querySelector("#video");
    if (!pipVideo.muted) {
      pipVideo.muted = true;
      pipMuteButton.textContent = "Unmute";
    } else {
      pipVideo.muted = false;
      pipMuteButton.textContent = "Mute";
    }
  });

  pipWindow.document.body.append(pipMuteButton);
});

Thông số kỹ thuật

Thông số kỹ thuật
Document Picture-in-Picture Specification
# documentpictureinpictureevent

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

Xem thêm