开发者

Transparency Filter

I have just done an html that should have some areas disabled. This areas following the design they should be at 50% transparency.

For that, I made a class called "transparent". The problem that I am having is that this site needs to be seen ALSO in IE6. The CSS I made is working in all browser but I couldnt tested it in IE6.

Till the moment I have been using IETester but there I cant see the transparency filter working (images, divs and etc are at their 100%.)

I read in internet that IETester has a problem with the transparency filter and I was trying to install a virtual machine so I could have IE6 etc etc etc and so on........Please, if you could help me to make this easier!!!...

I just would like to know if this css I made SHOULD be working in IE6 because I cant test it.

And if not, if you could provide me please a Better solution??

ps: I have already tried to install the transparency .htc file but It hasn't worked when we checed-in it to the Visual Studio where the solution is being made.

Thanks in advance,

This is the CSS:

.transparent{
zoom: 1;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /*IE5+*/
filter: alpha(opacity=50); /* IE5-7 */
-moz-opacity:0.5; /* Older than Firefox 开发者_Go百科0.9 */
-khtml-opacity: 0.5; /* Safari 1.x (pre WebKit!) */
opacity: 0.5; /* Firefox 0.9+, Safari 2, Chrome, Opera 9+, IE 9+ */}


I would recommend you use rgba() ...

Something like that :

element { background : rgba(255,255,255,0.5); }

This will give you a white with 50% transparency.

To get this to work on IE you should use this calculator

Will be something like :

element {
background:none;
-ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7FFFFFFF,endColorstr=#7FFFFFFF);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7FFFFFFF,endColorstr=#7FFFFFFF);
zoom: 1;
}

I've been using it a lot recently and it's working perfectly.


if you really want to make it work with IE6 then you just do one thing that create a image of the transparency that you need with width and height as per your needs... and then modify your CSS as per...

.transparent
{
background:url(path_to_your_transparent_image) repeat-x repeat-y;

}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜