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.widthSchreibgeschützt-
Bestimmt die Breite des schwebenden Videofensters.
PictureInPictureWindow.heightSchreibgeschützt-
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
PictureInPictureWindowgesendet, 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
Loading…