PictureInPictureWindow: resize-Ereignis
Eingeschränkt verfügbar
Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.
Das resize-Ereignis wird ausgelöst, wenn das schwebende Video-Fenster in der Größe verändert wurde.
Dieses Ereignis kann nicht abgebrochen werden und wird nicht nach oben weitergereicht.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Ereignishandler-Eigenschaft.
js
addEventListener("resize", (event) => { })
onresize = (event) => { }
Ereignistyp
Ein PictureInPictureEvent. Erbt von Event.
Eigenschaften des Ereignisses
Zusätzlich zu den unten aufgeführten Eigenschaften sind Eigenschaften von der übergeordneten Schnittstelle, Event, verfügbar.
PictureInPictureEvent.pictureInPictureWindow-
Gibt das
PictureInPictureWindowzurück, das in der Größe verändert wurde.
Beispiele
Fenstergrößen-Logger
html
<p>Resize the floating video window to fire the <code>resize</code> event.</p>
<p>Window height: <span id="height"></span></p>
<p>Window width: <span id="width"></span></p>
<video id="video" src="" muted autoplay></video>
js
const video = document.querySelector("#video");
const heightOutput = document.querySelector("#height");
const widthOutput = document.querySelector("#width");
function resize(evt) {
heightOutput.textContent = evt.target.height;
widthOutput.textContent = evt.target.width;
}
video.requestPictureInPicture().then((pictureInPictureWindow) => {
pictureInPictureWindow.onresize = resize;
// or
pictureInPictureWindow.addEventListener("resize", resize);
});
Spezifikationen
| Spezifikation |
|---|
| Picture-in-Picture # eventdef-pictureinpicturewindow-resize |
| Picture-in-Picture # dom-pictureinpicturewindow-onresize |