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

View in English Always switch to English

HTMLVideoElement: leavepictureinpicture-Ereignis

Eingeschränkt verfügbar

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

Want more browser support for this feature? Tell us why.

Das leavepictureinpicture-Ereignis wird ausgelöst, wenn das HTMLVideoElement den Bild-in-Bild-Modus erfolgreich verlässt.

Dieses Ereignis kann nicht abgebrochen werden und wird nicht nach oben weitergegeben.

Syntax

Verwenden Sie den Ereignisnamen in addEventListener():

js
addEventListener("leavepictureinpicture", (event) => { })

Alternativ können Sie ihn der Event-Handler-Eigenschaft der Schnittstelle zuweisen:

js
onleavepictureinpicture = (event) => { }

Ereignistyp

Ein PictureInPictureEvent. Erbt von Event.

Event PictureInPictureEvent

Beispiele

In diesen Beispielen wird ein Event-Listener für das leavepictureinpicture-Ereignis des HTMLVideoElement hinzugefügt. Anschließend wird eine Nachricht ausgegeben, wenn der Event-Handler auf das ausgelöste Ereignis reagiert hat.

Mit addEventListener():

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

function onExitPip() {
  console.log("Picture-in-Picture mode deactivated!");
}

video.addEventListener("leavepictureinpicture", onExitPip);

button.onclick = () => {
  if (document.pictureInPictureElement) {
    document.exitPictureInPicture();
  }
};

Mit der Event-Handler-Eigenschaft onleavepictureinpicture (beachten Sie jedoch, dass dadurch gegebenenfalls andere Event-Listener ersetzt werden, die über onleavepictureinpicture hinzugefügt wurden):

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

function onExitPip() {
  console.log("Picture-in-Picture mode deactivated!");
}

video.onleavepictureinpicture = onExitPip;

button.onclick = () => {
  if (document.pictureInPictureElement) {
    document.exitPictureInPicture();
  }
};

Spezifikationen

Spezifikation
Picture-in-Picture
# eventdef-htmlvideoelement-leavepictureinpicture
Picture-in-Picture
# dom-htmlvideoelement-onleavepictureinpicture

Browser-Kompatibilität

Siehe auch