Не могу получить скрытый div сверху в ie6 - PullRequest
Новая
       28

Не могу получить скрытый div сверху в ie6

0 голосов
/ 20 марта 2011

Я использую JQuery, чтобы показать / скрыть div.Он отлично работает в большинстве браузеров, кроме IE6.Когда я показываю div, он оказывается скрытым за другими div, а не поверх них.

Здесь вы можете увидеть, что я имею в виду: http://www.urlgone.com/d055c5/ (http://old.solesurvivorleather.com/static_product.html).

Если выПри наведении указателя мыши на список рассылки в правом верхнем меню вы увидите скрытый div 'listform t', который скользит вниз и показывается сверху, но в IE6 он скользит вниз за div-оберткой.

Вот CSSКод для обоих div: 

#listform {
    background-color:#F4F4EF;
    border:1px solid #8F8A7E;
    display:none;
    margin:0;
    max-width:150px;
    padding:10px;
    position:absolute;
    right:0;
    text-align:left;
    top:30px;
    width:150px;
    z-index:999;
}
#body-wrapper, #utility-wrapper {
    margin:0 auto;
    position:relative;
    width:950px;
}
#body-wrapper {
    background-color:#FFFFFF;
    border:0 solid black;
    position:absolute;
}

Ответы [ 3 ]

2 голосов
/ 20 марта 2011

В Internet Explorer позиционированные элементы генерируют новый контекст стека, начиная со значения z-index, равного 0. Поэтому z-index работает неправильно.Чтобы обойти эту проблему, присвойте родительскому элементу position:relative и установите для него z-index тот же номер, что и для дочернего элемента, для которого вы хотите установить z-index.Дочерний элемент также должен иметь position:absolute.Вот как это должно выглядеть.

<div style="position: relative; z-index: 10">
    <div style="position:absolute;z-index:10;">
        <img src"..." />
        ...
    </div>
</div>
0 голосов
/ 20 марта 2011

IE не обращает внимания на z-index интуитивно, когда речь идет о позиционируемых элементах. Если вы переместите элемент #listform в конец кода (непосредственно перед </body>), IE должен отобразить все правильно.

В качестве альтернативы, вы можете поместить свой элемент #listform в конец вашего #body-wrapper (непосредственно перед </div>.). Это поместит элемент выше в стек, чем все элементы, которые должны перекрываться. Поскольку ширина #body-wrapper является фиксированной, она должна обеспечивать стабильное вычисление смещения независимо от размера окна пользователя.

0 голосов
/ 20 марта 2011

вы пытались дать body-wrapper более низкое значение z-index?

...