Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

DocumentPictureInPictureEvent

Eingeschränkt verfügbar

Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Das DocumentPictureInPictureEvent-Interface der Document Picture-in-Picture API ist das Ereignisobjekt für das enter-Ereignis, das ausgelöst wird, wenn das Picture-in-Picture-Fenster geöffnet wird.

Event DocumentPictureInPictureEvent

Konstruktor

DocumentPictureInPictureEvent()

Erstellt eine neue Instanz des DocumentPictureInPictureEvent-Objekts.

Instanzeigenschaften

Erbt Eigenschaften von seinem Elternteil, Event.

window Schreibgeschützt

Gibt eine Window-Instanz zurück, die den Browsing-Kontext innerhalb des DocumentPictureInPicture-Fensters darstellt, auf dem das Ereignis ausgelöst wurde.

Instanzmethoden

Erbt Methoden von seinem Elternteil, Event.

Beispiele

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

Spezifikationen

Spezifikation
Document Picture-in-Picture Specification
# documentpictureinpictureevent

Browser-Kompatibilität

Siehe auch