0

基本的に、チュートリアルに従って作成したドロップダウン メニューを使用して Web ページを作成します。私のページのレイアウトは、タイトル/バナー用に 1 つ、ドロップダウン メニュー用に 1 つ、本文/コンテンツ用に 1 つを含む 3 つの個別のテーブルで構成されています。

私が最初に抱えている問題は、ドロップダウン メニューをスクロールすると、本文/コンテンツ テーブルの後ろにドロップすることです。z-index:-1 を含めるというこれに対する修正を見つけました。これは IE では完全に機能しましたが、クロムでテストした後、コンテンツ/本文テーブルでリンクと iframe を操作できなくなりました。

#bodytable {width:1100px;
        height:100%;
        margin:auto;
        position:relative;
        top:10px;
        z-index:-1;
        }

.css コード全体は次の場所にあります。

http://pastebin.com/T97JAjQ8

4

2 に答える 2

2

それぞれに正の z-index 値を与えてみてください。明らかに、数値が大きいほど、値が小さい他の数値よりも「上」になります。テーブルに「-1」を与える代わりに、10 のようなプラスの値を与えて、ドロップダウン メニューを「20」にします。ベースラインとしてボディの z-index を 0 に設定することもできます。

私はこれを確認していませんが、クロムが負の z-index 値を好まない可能性があります。

于 2013-01-06T07:22:37.547 に答える
0

負の z-index を指定すると、要素が body または wrapper div の下に移動するため、テーブル タグではなく body タグでイベントが発生したときに body 要素がそのテーブルの一番上にあるため、それらが相互作用するのを防ぎます。正の z-index 値を指定する必要があります。要素のデフォルトのスタック順序は、要素が定義されている位置で決まります。たとえば、メニュー div の後にテーブルを定義すると、テーブルの z-index 値が大きくなります。現在のスタック順序のみを変更することで問題を解決できます。その負の値を正に変えるだけです。

element {
z-index:1;
}

上記のコードは、ターゲット要素を現在のスタック順序の横にある他の要素の上に設定します。

于 2013-01-06T07:39:27.593 に答える