いろいろやる課、書く係

いろいろなことを、たんたんと記録するブログ

Android Chromeでアドレスバーを消したい場合は、全画面表示にする

Androidタブレットで表示される簡単なWEBアプリ(HTML返すだけ)をつくっています。

たぶんAndroidではなくなると思いますが……現段階はテスト。

 

業務でWEB系はやったことないマンなので、Googleさんに語り掛けながらやっています。

 

で、画面1枚表示するだけなので、アドレスバー表示したくないなぁと思ってググったら、

window.scrollTo(0, 1);

なんかでスクロールさせちまえばいいよ、という情報が出てくるのですが、

たしかにちょっとはスクロールするっぽいのですが、それHTMLの画面内の話なんですよね。

ブラウザ全体をスクロールさせないと、アドレスバー消えんのや……

 

あ、環境はこちら

Android タブレット

Android 10

Chrome 97.0.4692.98

 

開発

Windows 10 Pro

Chrome 97.0.4692.99

 

で、全画面表示にすればいいんだな、というところにたどり着きました。

こちらのページのお世話になりました。

blog.katsubemakito.net

わたしの場合はAndroidでよいので……スクロールスクロールして……下のほうにあった、metaタグで対応しました。

  <meta name="viewport" content="initial-scale=1.0">

  <!-- iOS/Safari用 -->
  <meta name="apple-mobile-web-app-capable" content="yes">

  <!-- Android/Chrome用 -->
  <meta name="mobile-web-app-capable" content="yes">

 

あとはHTMLのページをホーム画面に追加。

そこから立ち上げれば、最初から全画面表示になりました。

別のページからのリンクでの遷移だと、全画面表示にはなりませんが、今回は1画面だけ表示できればいいので、仕様満たしました。