Question

我使用以下代码在Javascript中设置图像透明度，但它仅适用于Internet Explorer（在FireFox，Opera，Safari和Google Chrome中仍然不透明）：

img = new Image();

img.src = "...";

img.style.filter       = "alpha(opacity=75);";
img.style.MozOpacity   = "0.75;";
img.style.opacity      = "0.75;";
img.style.KhtmlOpacity = "0.75;";

你能帮忙吗？

Answer 1

问题是字符串中的;，它被认为是浏览器的值的一部分，因此导致无效的数字。

您只需使用opacity属性的数字：

img.style.filter       = "alpha(opacity=75);";
img.style.MozOpacity   = 0.75;
img.style.opacity      = 0.75;
img.style.KhtmlOpacity = 0.75;

Answer 2

从引号内部删除分号，如下所示：

img.style.filter       = "alpha(opacity=75)";
img.style.opacity      = "0.75";

或没有引号全部：

img.style.filter       = "alpha(opacity=75)";
img.style.opacity      = 0.75;

您可以在此处查看：http://jsfiddle.net/jfriend00/tnDaD/

不再需要MozOpacity和KhtmlOpacity。需要这些浏览器的浏览器很长，很久就没用了。

Answer 3

不要在值中提供;，它会为您执行此操作：）

img = new Image();
img.src = "http://jsfiddle.net/img/logo.png";
img.style.opacity = "0.3";
document.body.appendChild(img);

http://jsfiddle.net/Cdjc6/

如何在Javascript中动态更改图像不透明度

3 个答案: