When users click on a link on my page an animated .gif image with a transparent
background is shown until a jquery window is loaded.
This is the div with that animated .gif <div id="debug" style="display:none;">
<img src="image/loading.gif" />
</div>
This .gif shows it's transparent background with all browsers however in IE6
and IE8 that transparency is lost.
We have tried this css but to no avail:
.div_fondo{
zoom: 1;
z-index:999999;
position:absolute;
top:0;
left:0;
background: #f5f5f5;
width:100%;
height:100%;
display:none;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
opacity: 0.5;
}
The z-index for the window is higher than that of the gif.
Why is this not showing properly in IE6 and IE8? Thank you
Here is the jquery css in case it is needed:
.ui-corner-tl { -moz-border-radius-topleft: 5px;
-webkit-border-top-left-radius: 5px; border-top-left-radius: 5px; }
.ui-corner-tr { -moz-border-radius-topright: 5px;
-webkit-border-top-right-radius: 5px; border-top-right-radius: 5px; }
.ui-corner-bl { -moz-border-radius-bottomleft: 5px;
-webkit-border-bottom-left-radius: 5px; border-bottom-left-radius: 5px; }
.ui-corner-br { -moz-border-radius-bottomright: 5px;
-webkit-border-bottom-right-radius: 5px; border-bottom-right-radius: 5px; }
.ui-corner-top { -moz-border-radius-topleft: 5px;
-webkit-border-top-left-radius: 5px; border-top-left-radius: 5px;
-moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px;
border-top-right-radius: 5px; }
.ui-corner-bottom { -moz-border-radius-bottomleft: 5px;
-webkit-border-bottom-left-radius: 5px; border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius:
5px; border-bottom-right-radius: 5px; }
.ui-corner-right { -moz-border-radius-topright: 5px;
-webkit-border-top-right-radius: 5px; border-top-right-radius: 5px;
-moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius:
5px; border-bottom-right-radius: 5px; }
.ui-corner-left { -moz-border-radius-topleft: 5px;
-webkit-border-top-left-radius: 5px; border-top-left-radius: 5px;
-moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px;
border-bottom-left-radius: 5px; }
.ui-corner-all { -moz-border-radius: 5px; -webkit-border-radius: 5px;
border-radius: 5px; }
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
