PictureInPictureWindow:resize 事件
當浮動影片視窗被調整大小時,會觸發 resize 事件。
此事件不可取消,也不會冒泡。
語法
在諸如 addEventListener() 之類的方法中使用事件名稱,或設定事件處理程式屬性。
js
addEventListener("resize", (event) => { })
onresize = (event) => { }
事件型別
一個 PictureInPictureEvent。繼承自 Event。
事件屬性
除了下面列出的屬性之外,父介面 Event 的屬性也可使用。
示例
視窗大小記錄器
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);
});
規範
| 規範 |
|---|
| 畫中畫 # eventdef-pictureinpicturewindow-resize |
| 畫中畫 # dom-pictureinpicturewindow-onresize |
瀏覽器相容性
載入中…