HTMLVideoElement: requestPictureInPicture()-Methode
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.
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
| Spezifikation |
|---|
| Picture-in-Picture> # dom-htmlvideoelement-requestpictureinpicture> |