requestFullscreenが効かない/画面が黒くなる
前回、AndroidのChromeで全画面表示をさせましたが……
Windowsでデモするときにもちょっと対応したいなと思い、またGoogleさんに語り掛けました。
document.body.requestFullscreen();
これでいけるで～と出てきたので、
window.onload
に仕込んだんですが、効かない……？？？
よく考えたら、onLoadじゃできないか……
イヤだよね、onLoadでいきなり全画面表示されたらね……
開発モードでやったら、ちゃんとError出てたよ。Chromeのデペロッパツールの存在を忘れている素人。
てことで
document.body.onclick
で、全画面と解除を切り替えることにしました。
が、全画面表示にすると、画面が黒くなるんですよ……
は？？？なんで？？？
てか上のリンクのサンプルも、よく見たら画面黒くなってるね？？？
え、全画面ってそういうものでしたっけ？？？
F11では普通に全画面表示になりますよ？
いろいろやってみたところ、
document.documentElement.requestFullscreen();
だと普通にできました。
bodyだと黒くなるのなんでかな……
あとは、いま全画面かどうかを確認して切り替えを……
最終結果はこれ。
document.body.onclick = function (event) {
if(document.fullscreenElement) {
document.exitFullscreen();
} else {
document.documentElement.requestFullscreen();
}
}
とりあえず今回は、人力での全画面/解除で仕様を満たします。
付け焼刃WEBマンが過ぎますね。
しかし……実はjavaScriptで定期的にリロードをしていて……
そうすると全画面は解除されますねぇ……
metaタグで最大化してたら大丈夫なんだけれど。（前回の方法）
今後Androidじゃなくなったらどうしよっかな……
↓
解決した
次回、キヨスクモードを発見！の回
