Android OSのキーボードはウェブサイトのコンテンツを移動しますか？

Question

私は100％の高さのdivの中に絶対的に配置された4つの要素を持つモバイルウェブサイトを持っています。そして、私がURLバーをクリックすると、divの高さが縮小してすべてを押し上げます。

この問題を解決する方法はありますか？または、100％の変更を防止しますか？または、JSを使用して画面サイズを取得し、そのように修正する必要がありますか？私はそれを正確な量に設定すれば正常に動作します。

Answer 1

キーボードを開いたときにアンドロイドブラウザがウィンドウのサイズを変更するため、解決策がありません。

Answer 2

私は次のようにAndroidのブラウザは、画面上のキーボードをポップアップ邪魔になるDOM要素のために-1にZインデックスを設定することによってこの問題を解決することができた：

function hideNavbar() // needed for Android browser pushing up keyboard 
{ 
    if (screen.height <= 480) // mobile 
    { 
     document.getElementById('navbar').style.zIndex = "-1"; 
    } 
} 

（私は入力テキストボックスのonclickイベントのためにこれを行いました）、次に 'onblur'を使用して（つまり、ユーザーが画面上部のテキスト/検索ボックスをクリックすると）、navbarのzindexを返します'1'：

function showNavbar() // needed for Android browser pushing up keyboard 
{ 
    if (screen.height <= 480) // mobile 
    { 
     document.getElementById('navbar').style.zIndex = "1"; 
    } 
} 

Answer 3

Kevin Pajakの回答が私のために働いた。 あなたはまた、メディアクエリを使用することができます

your.cssファイル：

.hide-element-on-keyboard { 
    z-index: 1; 
} 

@media screen and (min-height: 300px) { 
    .hide-element-on-keyboard { 
     z-index: -1; 
    } 
}