DOM

HTMLVideoElement.requestPictureInPicture() メソッド

 編集:2022.11.10 by T.A.

[Edge]。→

HTMLVideoElement をビデオをピクチャー イン ピクチャー モードにするようにユーザー エージェントに要求する。

mdn: ビデオをピクチャー イン ピクチャー モードで表示するための非同期リクエストを発行します。

mdn: ビデオがピクチャー イン ピクチャーに入れられるという保証はありません。そのモードに入る許可が与えられると、返された Promise は解決され、ビデオは enterpictureinpicture イベントを受信して、現在ピクチャー イン ピクチャーになっていることを通知します。

構文
HTMLVideoElement.requestPictureInPicture()
HTMLVideoElement HTMLVideoElement
戻り値

PictureInPictureWindow オブジェクトに解決される Promise。これは、ユーザーがフローティング ウィンドウのサイズを変更するときにリッスンするために使用できます。

/mdn

この例では、ビデオがピクチャー イン ピクチャー モードに入ることを要求し、フローティング ウィンドウのサイズ変更を処理するようにイベント リスナーを設定します。

function enterPictureInPicture() {
  videoElement.requestPictureInPicture()
    .then(pictureInPictureWindow => {
      pictureInPictureWindow.addEventListener("resize", () => onPipWindowResize(), false);
    })
}

HTML:

<VIDEO id=IdTest src="../../Sample/Eizou_M.mp4"></VIDEO>

JavaScript:

D=IdTest.requestPictureInPicture();  //=[object]:[object Promise]

JavaScript: 方法2。

function enterPictureInPicture(){
  IdTest.requestPictureInPicture()
    .then(pictureInPictureWindow => {
      pictureInPictureWindow.addEventListener("resize", () => onPipWindowResize(), false);
    })
}
enterPictureInPicture();

onPipWindowResize() の処理が必要のようで、mdn のはテストできず。


テスト