Picture-in-picture (video)
Picture-in-Picture API は動画を他のウィンドウの上にフロートする小さなウィンドウで再生し、別の作業をしながら視聴できます。
概要
Picture-in-Picture API は動画を他のウィンドウの上にフロートする小さなウィンドウで再生し、別の作業をしながら視聴できます。
対応ブラウザ
デスクトップ
Chrome 69+
Edge 79+
Safari 13.1+
Firefox 未対応
モバイル
Chrome Android 105+
Safari iOS 13.4+
Firefox Android 未対応
基本構文
JAVASCRIPT
const video = document.querySelector('video');
// PiPモード開始
await video.requestPictureInPicture();
// PiPモード終了
await document.exitPictureInPicture();実務での使いどころ
-
Picture-in-picture (video) の活用
Picture-in-Picture API。動画を小さなフローティングウィンドウで再生。
注意点
- 一部のブラウザでのみ対応。使用前にブラウザサポートを確認すること。
アクセシビリティ
- スクリーンリーダーでの読み上げを確認すること。