Controlling opacity

hey everyone,

i was wondering if there is a way to control opacity that is consistent across all browsers;

any ideas?

#489051

My idea would be to use PNG images with this PNG IE hack.

That'd probably be the best way if you want consistency. What I would do is make a stylesheet for IE which doesn't have the opacity, and one for every other browser. But that's not consistent.

#489056

If you want a simple opacity...

use CSS filter

Say, a CSS class making object turn into 60% opacity

.opacity60 {
	filter: Alpha(Opacity=60); // this is for IE
	-moz-opacity:.60; //this is for mozilla
	opacity:.60;
}

#489070

Or you could be smart and do it iGo's way. That works too

(thanks iGo. I didn't post that because I forgot what the IE/Mozilla versions were)

#489114

@nicholasheer: That's alright buddy!! I spent hours on setting up PNG hacks to get my work done only to find out that it's absolutely unnecessary unless I wanted partial transparencies. Besides that damn thing wouldn't work on PNGs used as background images.

Anyways... one thing about above class is, if applied to container (like div or table cell), it will affect the content as well. Means, the text or images inside that container will turn to 60% opacity.

#489119

hey "iGo" thanx for sharing that...

even i didn't know this....

#493066