PictureInPictureWindow
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Das PictureInPictureWindow
-Interface repräsentiert ein Objekt, das in der Lage ist, programmgesteuert die width
und height
sowie das resize event
des schwebenden Videofensters zu erhalten.
Ein Objekt mit diesem Interface wird durch den Rückgabewert des Versprechens von HTMLVideoElement.requestPictureInPicture()
erhalten.
Instanz-Eigenschaften
Das PictureInPictureWindow
-Interface erbt keine Eigenschaften.
PictureInPictureWindow.width
Nur lesbar-
Bestimmt die Breite des schwebenden Videofensters.
PictureInPictureWindow.height
Nur lesbar-
Bestimmt die Höhe des schwebenden Videofensters.
Instanz-Methoden
Das PictureInPictureWindow
-Interface erbt keine Methoden.
Ereignisse
Das PictureInPictureWindow
-Interface erbt keine Ereignisse.
resize
-
Wird an ein
PictureInPictureWindow
gesendet, wenn das schwebende Videofenster in der Größe verändert wird.
Beispiele
Gegeben sind ein <button>
und ein <video>
. Wenn der Button geklickt wird, wechselt das Video in den Bild-in-Bild-Modus; wir fügen dann ein Ereignis an, um die Abmessungen des schwebenden Videofensters in die Konsole auszugeben.
const button = document.querySelector("button");
const video = document.querySelector("video");
function printPipWindowDimensions(evt) {
const pipWindow = evt.target;
console.log(
`The floating window dimensions are: ${pipWindow.width}x${pipWindow.height}px`,
);
// will print:
// The floating window dimensions are: 640x360px
}
button.onclick = () => {
video.requestPictureInPicture().then((pictureInPictureWindow) => {
pictureInPictureWindow.onresize = printPipWindowDimensions;
});
};
Spezifikationen
Specification |
---|
Picture-in-Picture # interface-picture-in-picture-window |
Browser-Kompatibilität
BCD tables only load in the browser