HTMLVideoElement: requestPictureInPicture()-Methode
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Die HTMLVideoElement-Methode
requestPictureInPicture() stellt eine asynchrone Anfrage, um das Video im Bild-in-Bild-Modus anzuzeigen.
Es ist nicht garantiert, dass das Video in den Bild-in-Bild-Modus geschaltet wird. Wenn die Erlaubnis für diesen Modus erteilt wird, wird das zurückgegebene Promise erfüllt und das Video erhält ein enterpictureinpicture-Ereignis, um es darüber zu informieren, dass es jetzt im Bild-in-Bild-Modus ist.
Syntax
requestPictureInPicture()
Parameter
Keine.
Rückgabewert
Ein Promise, das zu einem PictureInPictureWindow-Objekt aufgelöst wird, welches verwendet werden kann, um zu hören, wenn ein Benutzer dieses schwebende Fenster in der Größe verändert.
Ausnahmen
NotSupportedErrorDOMException-
Wird geworfen, wenn die Funktion nicht unterstützt wird (zum Beispiel durch eine Benutzereinstellung oder durch eine Plattformbeschränkung deaktiviert).
SecurityErrorDOMException-
Wird geworfen, wenn die Funktion durch eine Permissions Policy blockiert wird.
InvalidStateErrorDOMException-
Wird geworfen, wenn das Lesezustand des Videoelements
HAVE_NOTHINGist, oder wenn das Videoelement keine Videospur hat, oder wenn dasdisablePictureInPicture-Attribut des Videoelementstrueist. NotAllowedErrorDOMException-
Wird geworfen, wenn
document.pictureInPictureElementnullist und das Dokument keine transiente Aktivierung hat.
Sicherheit
Transiente Benutzeraktivierung ist erforderlich. Der Benutzer muss mit der Seite oder einem UI-Element interagieren, damit diese Funktion funktioniert.
Beispiele
Dieses Beispiel fordert, dass das Video den Bild-in-Bild-Modus betritt, und setzt einen Ereignis-Listener, um das Ändern der Größe des schwebenden Fensters zu behandeln.
function enterPictureInPicture() {
videoElement.requestPictureInPicture().then((pictureInPictureWindow) => {
pictureInPictureWindow.addEventListener("resize", () =>
onPipWindowResize(),
);
});
}
Spezifikationen
| Specification |
|---|
| Picture-in-Picture> # request-pip> |
Browser-Kompatibilität
Loading…