Raphael不透明度不在IE上显示

Question

在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上运行没有问题。

Answer 1

filter仅适用于IE5-7。要支持IE8，您需要此属性之前您的filter属性：

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

此QuirksMode article也可以为您提供帮助。

---

实际上，尝试一下课程：

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

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