DOM

Element.requestFullscreen() メソッド

 編集:2022.09.23 by T.A.

[Edge]。→

element を全画面表示するためにブラウザーに要求し、Promise を返します。

要素が全画面モードに移行することは保証されていません。全画面モードに移行する許可が与えられている場合は、返される Promise が解決され、文書が全画面モードになったことを知ることができる fullscreenchange イベントを受け取るようになります。権限が拒否された場合は、代わりに fullscreenerror イベントを受け取ります。

このメソッドはユーザーの操作又は機器の方向の変更によって呼び出す必要があり、そうでなければ失敗します。

全画面で表示することができる要素は、HTML 名前空間にあり(つまり、標準の HTML の要素であり)、加えて <svg> 要素や <math> 要素、文書の最上位にある要素、又は allowfullscreen 属性を持つ <iframe> だけです。すなわち、<frame> や <object> の内部にある要素は全画面で表示できません。

構文
element.requestFullscreen()
element Element
戻り値

全画面への移行が完了した場合は、undefined の値で解決した Promise

例外

全画面のリクエストが失敗した場合は、Promise が例外で拒否されるかもしれません。発生しうる例外は以下の通りです。

TypeError
以下の状況の一つが発生する可能性あります。

requestFullscreen() を呼び出す前に、fullscreenchange 及び fullscreenerror イベントのハンドラーを設定してください。そうすれば、いつ全画面モードに切り替えることに成功したか(又は権限がなくて拒否されたか)を知ることができます。

テスト

HTML:

<SPAN id=IdTest style="background-color:#fee; color:black; font-size:30px">SPAN要素</SPAN><BR>
<SPAN id=IdLog></SPAN>

JavaScript:

function JobErr(eve){          //fullscreenerrorイベントが発生した時の処理:eveにはEventオブジェクトが入る。
  IdLog.innerText=eve.message; //エラーメッセージの書き込み。
}
IdTest.onfullscreenerror=JobErr; //IdTest に fullscreenerror イベントを組み込む。
IdTest.requestFullscreen();      //フルスクリーンを要求。

テスト