IE上不显示Raphael不透明度

问题描述

在Internet Explorer上查看我的网站时，div的不透明度出现问题.使用Raphael 2.0(未缩小)，我使用以下代码创建一个矩形:

var rIn = Raphael("myDiv", "100%", "100%");
rIn.rect(0, 0, "100%", "100%").attr({fill:"black", stroke:"none", opacity:0.6});

在我的CSS文件中，如果我使用opacity标签使用了透明的div，我也将其写为包含filter的文件，该文件似乎对IE正常.

opacity:0.6; filter: alpha(opacity = 60); 

但是，Raphael似乎不允许将filter作为属性，因此该矩形根本不会显示.这只是IE上的一个问题-它可以在Win/Mac上的FF/Chrome/Safarai上正常运行.

解决方案

filter仅适用于IE5-7.为了支持IE8，您还需要之前此属性:

.opacity60 {
  opacity: 0.6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  filter: alpha(opacity=60);
}

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";

这篇 QuirksMode文章也应为您提供帮助.

---

实际上，尝试一堂课:

.opacity60 {
  opacity: 0.6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  filter: alpha(opacity=60);
}

并通过setAttribute('class', 'opacity60')调用将矩形的类设置为opacity60.

I'm having a problem with the opacity of a div when my site is viewed on Internet Explorer. Using Raphael 2.0 (un-minified) I create a rectangle using the following code:

var rIn = Raphael("myDiv", "100%", "100%");
rIn.rect(0, 0, "100%", "100%").attr({fill:"black", stroke:"none", opacity:0.6});

In my CSS files if I have transparent divs using the opacity tag, I also write it include filter which seems to work fine for IE.

opacity:0.6; filter: alpha(opacity = 60); 

However, Raphael does not appear to allow filter as a property, so this rectangle does not show up at all. This is only a problem on IE - it works on FF/Chrome/Safarai on Win/Mac without a problem.

解决方案

filter only works for IE5-7. To support IE8, you need this property as well before your filter property:

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";

This QuirksMode article should help you as well.

---

Actually, try a class:

.opacity60 {
  opacity: 0.6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  filter: alpha(opacity=60);
}

And set your rectangle's class to opacity60 via a setAttribute('class', 'opacity60') call.

这篇关于IE上不显示Raphael不透明度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！