IE7とIE8の要素の下に表示されるjQueryモーダルウィンドウ

Question

私はページ上でjqueryを使用するモーダルウィンドウを持っています。これはchrome、firefox、IE8では完璧に機能しますが、IE6とIE7はウィンドウが他の要素の下に表示され、誤った位置に表示されます。ここで

は、ウィンドウのCSSです：

.simple_overlay { 
display: none; 
z-index: 10000; 
background-color: #FCFCFC; 
background-image: none; 
background-image: url(http://static.flowplayer.org/img/commerce/box-512.png); 
padding: 20px; 
width: 675px; 
height: 400px; 
min-height: 200px; 
-moz-border-radius: 8px 8px 8px 8px; 
border: 10px solid rgba(82, 82, 82, 0.698); 
-moz-box-shadow: 0 0 90px 5px #000; 
-webkit-box-shadow: 0 0 90px #000; 
} 

Answer 1

あなたがそこにあなたのzインデックスを持ついくつかの問題を抱えている可能性があります。そのクラスにposition：relativeを入れてみてください。相続人

IE z屈折率gimmicsのより長い説明

http://annevankesteren.nl/2005/06/z-index

Answer 2

IE 6と7は、zインデックス（「その値でロック」）が位置値を見るたびにスタックをリセットすること静的ではありません。つまり、この要素の上にposition: relativeなどの要素がある場合、この要素はこのレイヤーでのみロックされ（Z-インデックスがない場合は0）、提供されるZ-インデックスは他の要素との相対的なものになりますこのzインデックスで。任意の親ではなく、ページ全体に関連することを確認して修正します。