Internet ExplorerのZ-indexが機能しない
私はモバイルサイト用のメニューを作成しました。メニューボタンをクリックすると、メニュースライドが開き、これがページです。
http://www.roadtotheweb.com/m.about.html
唯一の問題は、IEおよびWindows Phoneでは、メニューが一番上の要素ではないため、オブジェクトの後ろにスライドすることです。
Zインデックス、位置タイプ、hasLayoutを無効に変更しようとしました。
何卒よろしくお願いいたします。
J
既知のバグに対処しているようです：
「Internet Explorerで配置された要素は、0のz-index値から始まる新しいスタッキングコンテキストを生成します。したがって、z-indexは正しく機能しません。」
バグレポートは Quirksmode のWebサイトと回避策の説明 inthis blog post で確認できます。
基本的にあなたがしなければならないことは、より高いZ-インデックスを持つ要素でそれをラップすることです。例えば、これは回避策の簡単なスケッチです：
<div style="position: relative; z-index: 3000">
<div style="position:absolute;z-index:1000;">
...
</div>
</div>
私は定期的に2つのレイヤーを交換して、z-Indexを0から1に変更し、その逆も同様です。数年後、IEでの動作が停止しました。 z-Indexを1と2に変更しました。これで問題なく動作します。バグは0のz-Indexに関係していると思います。