文本动画没有'我不在IE工作

Question

此网站上带有文本的栏users.telenet.be/stijn.aerts应在每5秒后更改一次。问题是它在IE中不起作用，在其他浏览器中也起作用。。。

有人知道线索吗？

Answer 1

Internet Explorer没有将父级的不透明度规则应用于绝对定位的子级。在这种情况下，您将设置列表项的不透明度，但这不会级联到其中绝对定位的h2元素上。

您可以使用的一种解决方法是将父子列表项元素的位置设置为相对。这会导致不透明性声明级联，甚至影响绝对定位的子对象。

ul.textslideshow li {
    opacity: 0;
    position: relative;
    animation: textAnimation 25s ease-out infinite;
}

如果您不希望定位父级列表项，您可以在标题上设置要继承的不透明度：

ul.textslideshow li h2 {
    opacity: inherit;
    position: absolute;
    /*...*/
}

Internet Explorer中的问题示例：http://jsfiddle.net/xTG85/show/
IE中解决的问题示例：http://jsfiddle.net/xTG85/1/show/