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 zum Anzeigen des Videos im Bild-in-Bild-Modus.
Es ist nicht garantiert, dass das Video im Bild-in-Bild-Modus angezeigt wird. Wenn die Berechtigung für diesen Modus erteilt wird, wird das zurückgegebene Promise aufgelöst und das Video erhält ein enterpictureinpicture-Ereignis, um mitzuteilen, dass es sich nun im Bild-in-Bild befindet.
Syntax
requestPictureInPicture()
Parameter
Keine.
Rückgabewert
Ein Promise, das auf ein PictureInPictureWindow-Objekt aufgelöst wird, das verwendet werden kann, um zu überwachen, wann ein Benutzer dieses schwebende Fenster vergrößert oder verkleinert.
Ausnahmen
NotSupportedErrorDOMException-
Wird ausgelöst, wenn das Feature nicht unterstützt wird (zum Beispiel deaktiviert durch eine Benutzereinstellung oder durch eine Plattformbeschränkung).
SecurityErrorDOMException-
Wird ausgelöst, wenn das Feature durch eine Permissions Policy blockiert ist.
InvalidStateErrorDOMException-
Wird ausgelöst, wenn der
readStatedes VideoelementsHAVE_NOTHINGist, oder wenn das Videoelement keine Videospur hat, oder wenn dasdisablePictureInPicture-Attribut des Videoelementstrueist. NotAllowedErrorDOMException-
Wird ausgelöst, wenn
document.pictureInPictureElementnullist und das Dokument keine transient activation hat.
Sicherheit
Transient user activation wird benötigt. Der Benutzer muss mit der Seite oder einem UI-Element interagieren, damit dieses Feature funktioniert.
Beispiele
Dieses Beispiel fordert an, dass das Video in den Bild-in-Bild-Modus wechselt, und setzt einen Ereignislistener auf, um das Vergrößern und Verkleinern des schwebenden Fensters zu handhaben.
function enterPictureInPicture() {
videoElement.requestPictureInPicture().then((pictureInPictureWindow) => {
pictureInPictureWindow.addEventListener("resize", () =>
onPipWindowResize(),
);
});
}
Spezifikationen
| Specification |
|---|
| Picture-in-Picture> # request-pip> |