У меня есть div с положением, установленным на absolute, и несколько div внутри него. Как только я добавляю фильтр непрозрачности к этому div, даже если непрозрачность установлена на 100, дочерние div исчезают в IE7.
То же самое происходит, если я изменяю непрозрачность через jQuery даже без абсолютной позиции.
Кто-нибудь знает исправление?
заранее спасибо
Пример
<style type="text/css">
#wrap {
opacity: 0.5; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(Opacity=50); -moz-opacity: 0.50; -khtml-opacity: 0.5;
position:absolute;
}
#sub1 {
position:absolute;
width:200px;
height:200px;
background-color:#F00;
}
</style>
<div id="wrap">
<div id="sub1"></div>
</div>
Если обертка имеет непрозрачность и абсолютное положение, sub1 невидим в IE7
Второй сценарий:
#wrap {
position:absolute;
width:500px;
height:500px;
color:#fff;
filter: alpha(Opacity=100);
}
#sub1 {
position:absolute;
}
#sub2_bg {
width:500px;
height:500px;
background-color:#000;
position:absolute;
filter: alpha(Opacity=50);
}
#sub2_text {
position:absolute;
}
</style>
<div id="wrap">
<div id="sub1">
<div id="sub2_bg"></div>
<div id="sub2_text">sample text</div>
</div>
</div>
В этом сценарии текст «образец текста» внутри sub2_text имеет альфа-прозрачность 50%, как только обтекание имеет фильтр, даже если его непрозрачность = 100. Очевидно, я мог бы удалить альфа (непрозрачность = 100), но та же проблема возникает, когда я анимирую непрозрачность обтекания до 0,5 и обратно до 1, потому что тогда div получает фильтр. Я заметил, что только те части, которые имеют альфа-прозрачный div ниже, имеют эту проблему, если текст был больше, чем sub1_bg, это затронуло бы только части вверху sub1_bg. Опять же только в IE 7.
Было бы неплохо, если бы кто-нибудь мог показать мне исправление и для этого. Спасибо.
