Fullscreen API
Fullscreen API は任意の要素をブラウザの全画面に表示します。動画やプレゼンテーション、ゲームなどで使用されます。
概要
Fullscreen API は任意の要素をブラウザの全画面に表示します。動画やプレゼンテーション、ゲームなどで使用されます。
対応ブラウザ
デスクトップ
Chrome 71+
Edge 79+
Safari 16.4+
Firefox 64+
モバイル
Chrome Android 71+
Safari iOS 未対応
Firefox Android 64+
基本構文
HTML
document.getElementById('video').requestFullscreen();
// 全画面解除
document.exitFullscreen();
// 全画面状態の検知
document.addEventListener('fullscreenchange', () => {
console.log('全画面:', !!document.fullscreenElement);
});実務での使いどころ
-
Fullscreen API の活用
Fullscreen API。要素を全画面表示するAPI。
注意点
- 一部のブラウザでのみ対応。使用前にブラウザサポートを確認すること。
アクセシビリティ
- スクリーンリーダーでの読み上げを確認すること。