使用 jquery 设置不透明度在 IE8 中不起作用，但在 IE7 中起作用答案

【问题标题】：Setting opacity with jquery not working in IE8, but works in IE7使用 jquery 设置不透明度在 IE8 中不起作用，但在 IE7 中起作用
【发布时间】：2011-05-23 06:07:16
【问题描述】：

我的代码：

$('.diff a').css('opacity', .5);

在 IE7、firefox 和 chrome 中工作，正确地使锚元素显示为褪色，但在 IE8 中则不行。

我使用的是 jquery 1.4.4

编辑：这是一个显示问题http://jsfiddle.net/KUJYF/的测试页面

【问题讨论】：

@Robert 文档类型为 <!DOCTYPE HTML>。顺便说一句，我发现了这个相关的问题：stackoverflow.com/questions/3452868/….
@Kyle 该解决方案是否不起作用（设置display: inline-block）？如果你想不通，我会顺从：dowebsitesneedtolookexactlythesameineverybrowser.com
@Kyle 我刚刚在 IE8 中使用 display: inline-block 进行了测试，它似乎可以工作。所以，你自己找到答案就好了！

标签： jquery internet-explorer

【解决方案1】：

使用淡入淡出

http://api.jquery.com/fadeTo/

【讨论】：

嘿，你有 JS 错误吗？你能提供更多细节吗？可能是您网站的网址
这不会设置不透明度，它会动画到定义的值。

【解决方案2】：

你为什么要使用不透明度？为什么不只使用较浅的颜色来模拟效果，而不是使用 opacity 属性引入的开销。

【讨论】：

是的，我可以做到这一点，不透明度会比为 :hover、:visited 等重新定义不同的较轻版本的样式更容易。
您也可以使用微软特定的 alpha 过滤器：webdesign.about.com/od/css3/a/aa121306.htm
我会推荐使用样式，它比不透明度过滤器的 jquery 应用程序更快更干净，以模仿样式的意图。

【解决方案3】：

我在尝试为不透明度设置动画以淡入和淡出 span 元素时遇到了同样的情况。在 IE7 下，span 的动画效果完美无缺。在 IE9 下，同样的故事。但是，在 IE8 下，没有动画。

感谢上面提出的原始问题的cmets，我发现通过将span的CSS样式设置为inline-block，动画开始在IE8中工作，这让我相信IE8可能不支持内联元素的不透明度（至少，不是 jQuery 1.4.4 实现它的方式）。

这是我用于测试的示例：http://jsfiddle.net/ddYuJ/2/

【讨论】：