[js] スマートフォンのアドレスバーを、コンテンツの高さが足りないときでも非表示にする(改良版)

Pocket

前回から改良したので、別記事にしました。
基本的な処理はほとんど変わっていませんが少し改良しています。

  • スクロールの判定方法を変更
  • アドレスバーが消えたときのイベントが取得できるようになった

Demo

デモ(別ウィンドウで開きます)

Source

hide_address_bar.min.js(圧縮版)
hide_address_bar.js
hide_address_bar.coffee

Usage

基本はjsを読み込むだけです。アドレスバー非表示のイベントを取得する場合、jsを記述します。

<script src="js/hide_address_bar.js"></script>
<script>
// アドレスバー非表示のイベントを取得
window.addEventListener("hideAddressBar", function (e) {
    // 例えば、アドレスバーが非表示になったときの画面の高さを
    // bodyのdata属性(data-window-height)に設定する
    document.body.setAttribute("data-window-height", window.innerHeight);
});
</script>
</script>

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です