DocumentPictureInPictureEvent:窗口属性

可用性有限

此功能不是基线功能,因为它在一些最广泛使用的浏览器中不起作用。

实验性: 这是一个 实验性技术
在生产环境中使用此功能之前,请仔细查看 浏览器兼容性表

安全上下文:此功能仅在 安全上下文(HTTPS)中可用,在某些或所有 支持的浏览器 中可用。

DocumentPictureInPictureEvent 接口的 window 只读属性返回一个 Window 实例,该实例表示事件触发所在的 DocumentPictureInPicture 窗口内的浏览上下文。

一个 Window 对象实例。

示例

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);
});

规范

规范
文档画中画
# dom-documentpictureinpictureevent-window

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。

另请参阅