1

ページの上部に固定された要素 (ヘッダー) が消えてしまうという問題に遭遇しました。これは、私が作成していたモバイル サイトで見つかりました。

これを引き起こしたのは、サイドバー ナビゲーションを開くメニュー ボタンをクリックしたことでした。このボタンをクリックすると、サイドバーは期待どおりに開きますが、ヘッダーが消えてしまいます。そこに残るのは、私が使っていたPhark Methodの画像置換技術の残骸です。「メニュー」というテキストは取り残されました。（これは当面の問題にとって重要ではないと確信していますが、間違っている可能性があります。）

要素には次のheaderようなスタイルがありました。

header{
    position: fixed;
    top: 0;
    z-index: 10000;
    width: 100%;
    background: url('../images/header-bg.png') #111 repeat-x top left;
    border-bottom: 1px solid #090909;
    text-align: center;
}

これは、Android 4.0 ストック ブラウザーでのみ発生します (Galaxy Tabs/Galaxy Nexus は、私がテストしたものです)。

Android 4.0 ブラウザーだけでこれが発生する原因は何ですか?

4

1 に答える 1

8

問題のように見えたのは、要素にプロパティ値headerがないという事実でした。leftこれを修正するためleft:0;に、要素にプロパティを追加しheaderて、次の CSS を提供しました。

header{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10000;
    width: 100%;
    background: url('../images/header-bg.png') #111 repeat-x top left;
    border-bottom: 1px solid #090909;
    text-align: center;
}

これを理解した後、固定配置を使用するデスクトップ サイトで同様の問題が発生したことを思い出しました。プロパティを設定していなかったという事実leftにより、ページが読み込まれたときに固定要素が表示されませんでした。

これにより、将来的にユーザーが修正するためのアイデアが修正/スパークされることを願っています! これからは、ax 軸と y 軸の両方の位置プロパティをすべての固定要素に設定することを知っています;)

于 2013-04-11T22:54:50.773 に答える