如果定位，则jquery不会淡出文本：绝对;

Question

我有LI想要淡出并重新进入。在列表项中我有一些文字。该文本完全位于LI之内。

问题是在IE8中（IE6和7看起来很好）我可以让所有内容都消失，除了文字：

http://jsbin.com/esamu/13

如果删除文本元素上的绝对定位（在本例中为P），则IE8可以正确淡化文本：

http://jsbin.com/esamu/14

任何人都知道这是为什么？有人知道修复吗？

更新：

如果文本完全定位，这似乎是IE8中的一般问题。所以，不是严格的绝对。我有预感这是由于cleartype fade bug。

Answer 1

通过定位文本，IE8不会继承不透明度。实际上，我认为这与cleartype bug不同。

我已使用有效的脚本更新了您的脚本：http://jsbin.com/esamu/19

我所做的就是将$（'li'）更改为$（'li，p'），以便明确选择定位元素。

Answer 2

arnie和prodigit都提供了有用的替代方案。谢谢！

最后，这是我们提出的相当愚蠢的解决方案：

在我们的例子中，我们有一系列LI，其中包含一个图像，文字在顶部分层（定位）。我们为整个LI做出了贡献，一旦完成，我们就会淡入下一个。

问题是文本在IE8中可能没有fadeOut / In（也许是7）。修复方法是，不是淡出每个LI，而是在中在顶部的图像中淡化，恰好匹配背景（我将其称为'IE淡入淡出掩码'）。一旦该图像完全淡入，我们在背景中换出LI，然后淡出前面的图像。

这为我们提供了完全相同的视觉外观，以及在IE中保持平滑的类型的奖励。

我认为这也可以用于将LI淡入另一个（在其他淡入淡出的同时淡出一个淡出）并且只需要为每个LI克隆'IE淡入淡出掩码'。

Answer 3

不确定为什么但你是否尝试过简单地添加元数据以强制IE *呈现为IE7以进行快速修复？

Answer 4

我在ie8中的绝对定位文本遇到了同样的问题（ie7,6很好）我通过为元素渐变指定更高的z指数而向渐弱指定更低来解决它：

$('#fadeoutdiv').css({zIndex:7}).fadeOut(2000); $('#fadeindiv').css({zIndex:6}).fadeOut(2000);

感谢Al Flemming提供此解决方案。