Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
DocumentPictureInPicture
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimentell:Dies ist eineexperimentelle Technologie
Überprüfen Sie dieBrowser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Sicherer Kontext: Diese Funktion ist nur insicheren Kontexten (HTTPS) in einigen oder allenunterstützenden Browsern verfügbar.
DasDocumentPictureInPicture-Interface derDocument Picture-in-Picture API ist der Einstiegspunkt für die Erstellung und Verwaltung von Dokument-Picture-in-Picture-Fenstern.
Es wird über dieWindow.documentPictureInPicture-Eigenschaft aufgerufen.
Instanzeigenschaften
Übernimmt Eigenschaften von seinem Elternteil,EventTarget.
windowSchreibgeschütztExperimentellGibt eine
Window-Instanz zurück, die den Browsing-Kontext innerhalb des Picture-in-Picture-Fensters darstellt.
Instanzmethoden
Übernimmt Methoden von seinem Elternteil,EventTarget.
requestWindow()ExperimentellÖffnet das Picture-in-Picture-Fenster für den aktuellen Haupt-Browsing-Kontext. Gibt ein
Promisezurück, das mit einerWindow-Instanz erfüllt wird, die den Browsing-Kontext innerhalb des Picture-in-Picture-Fensters darstellt.
Ereignisse
Übernimmt Ereignisse von seinem Elternteil,EventTarget.
enterExperimentellWird ausgelöst, wenn das Picture-in-Picture-Fenster erfolgreich geöffnet wird.
Beispiele
const videoPlayer = document.getElementById("player");// …// Open a Picture-in-Picture window.const pipWindow = await window.documentPictureInPicture.requestWindow({ width: videoPlayer.clientWidth, height: videoPlayer.clientHeight,});// …SieheDocument Picture-in-Picture API Example für eine vollständig funktionierende Demo (siehe auch den vollständigenQuellcode).
Spezifikationen
| Specification |
|---|
| Document Picture-in-Picture Specification # documentpictureinpicture |