PictureInPictureWindow: resize event
The resize
event fires when the floating video window has been resized.
Bubbles | No |
---|---|
Cancelable | No |
Interface | PictureInPictureWindow |
Event handler property | onresize |
Examples
Window size logger
<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>
const video = document.querySelector('#video'); const heightOutput = document.querySelector('#height'); const widthOutput = document.querySelector('#width'); function resize(evt) { heightOutput.textContent = evt.target.width; widthOutput.textContent = evt.target.width; } video.requestPictureInPicture() .then(pictureInPictureWindow => { pictureInPictureWindow.onresize = resize; });
addEventListener equivalent
You could set up the event handler using the addEventListener()
method:
pictureInPictureWindow.addEventListener('resize', resize);
Specifications
Browser compatibility
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
resize_event |
69 |
79 |
No |
No |
56 |
13.1 |
No |
No |
No |
No |
13.4 |
No |
See also
© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/PictureInPictureWindow/resize_event