image opacity in ie

Forum Moderators: not2easy

Message Too Old, No Replies

image opacity in ie

image opacity renders fine in firefox but not mie

pnamajck

5:07 pm on Nov 24, 2009 (gmt 0)

image opacity renders fine in firefox 3.5 but not mie 7/8. the image below resides behind text/content but is not considered background element.

.sig-stamp {
position: fixed;
float: right;
filter:Alpha(Opacity=20);
opacity: 0.20;
-khtml-opacity: 0.20;
-moz-opacity: 0.20;
bottom: 15px;
right: 6px;
}

if necessary :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

JAB Creations

2:22 am on Nov 25, 2009 (gmt 0)

First implement patch style sheets via conditional comments...

Then inside each style sheet add the following for opacity...

.fade {filter:progid:DXImageTransform.Microsoft.Alpha(opacity=20);}
.opaque {filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);}

Keep in mind your title values for the link element have the be the same as the main style sheet or those style sheets will not be applied.

- John

pnamajck

4:38 pm on Nov 26, 2009 (gmt 0)

thanks for the effort . . . was hopin' to integrate an effect without utilizng javascript.

the problem was that position: fixed; killed the opacity effect . . . and float: right; is supposed to allow the opacity effect. it does work utilizing inline coding . . . but does not seem to work when using internal css.

so, okay . . . thanks anyway.

pnamajck

5:38 pm on Nov 26, 2009 (gmt 0)

never mind . . . turns out that no longer works either. just another non-compliant issue with mie.

jameshopkins

9:23 pm on Nov 26, 2009 (gmt 0)

For IE8, make sure you add the '-ms-' prefix to the 'filter' property, and use the longhand syntax value. AFAIK, the shorthand value doesn't work.

pnamajck

5:58 pm on Nov 27, 2009 (gmt 0)

thanks for your efforts . . . still negative. and other web-sites refer to similar difficulties with regard to mie and png images.

every other browser includes only one code for compliancy . . . mie chooses to skirt this issue. the more proprietary mie becomes . . . the less they will be accepted.

likes2burn

11:48 pm on Dec 1, 2009 (gmt 0)

The technique I found to work is add the MIE style="filter:alpha(opacity=20)" directly into the image tag.

e.g.
<img src="klematis.jpg" width="150" height="113" alt="klematis"
style="filter:alpha(opacity=40)" />

And you can keep the standards compliant browser opacity in the CSS file still without issue. It's a workaround I know, but I think it may be the only solution.

swa66

1:19 am on Dec 2, 2009 (gmt 0)

Are you using png-8 or png-24 ? I think IE has less trouble with PNG-8 ... yeah, the lesser format ...

SuzyUK

1:29 am on Dec 2, 2009 (gmt 0)

but I think it may be the only solution.

Not likely when MSIE is concerned, and certainly not optimal usage inline.. why have other browsers choke over IE proprietary code?