HTMLVideoElement: enterpictureinpicture 事件
當 HTMLVideoElement 成功進入畫中畫模式時，會觸發 enterpictureinpicture 事件。
此事件不可取消，也不會冒泡。
語法
在諸如 addEventListener() 之類的方法中使用事件名稱，或設定事件處理程式屬性。
js
addEventListener("enterpictureinpicture", (event) => { })
onenterpictureinpicture = (event) => { }
事件型別
一個 PictureInPictureEvent。繼承自 Event。
事件屬性
此介面還繼承了其父介面 Event 的屬性。
示例
這些示例為 HTMLVideoElement 的 enterpictureinpicture 事件添加了一個事件監聽器，然後在事件處理程式響應事件觸發時釋出一條訊息。
使用 addEventListener()
js
const video = document.querySelector("#video");
const button = document.querySelector("#button");
function onEnterPip() {
console.log("Picture-in-Picture mode activated!");
}
video.addEventListener("enterpictureinpicture", onEnterPip);
button.onclick = () => {
video.requestPictureInPicture();
};
使用 onenterpictureinpicture 事件處理程式屬性
js
const video = document.querySelector("#video");
const button = document.querySelector("#button");
function onEnterPip() {
console.log("Picture-in-Picture mode activated!");
}
video.onenterpictureinpicture = onEnterPip;
button.onclick = () => {
video.requestPictureInPicture();
};
規範
| 規範 |
|---|
| 畫中畫 # eventdef-htmlvideoelement-enterpictureinpicture |
| 畫中畫 # dom-htmlvideoelement-onenterpictureinpicture |
瀏覽器相容性
載入中…