0

所以，是的，IE8 很糟糕，但我需要它兼容。它在 Firefox 中运行良好，我从纯 CSS 切换到 CSS/jQuery，以便它可以与 IE8 一起使用。

这是CSS：

#test p {
    opacity: 0;
    margin-top: 25px;
    font-size: 21px;
    text-align: center;
}

我认为这是 IE8 不喜欢的 CSS Opacity。

编辑：已解决，答案如下。

4

3 回答 3

1

问题在于，对于 ie8，您最好使用以下代码： 

filter: alpha(opacity=100)

比不透明度。
请注意数字从 0 变为 100 而不是 0 变为 1，如不透明度

于 2013-07-10T10:52:49.293 回答
0

好的，我已经解决了这个问题，并决定添加答案。

CSS需要更改为：

#test p {
    background: none repeat scroll 0 0 #fff;
    filter: alpha(opacity=0);
    opacity: 0;
    margin-top: 25px;
    font-size: 21px;
    text-align: center;
}

由于 IE8 不支持 Opacity，它需要：

过滤器：阿尔法（不透明度= 0）；

然后这会“破坏”文本，导致边缘变得锯齿/模糊并且看起来非常难看。要解决此问题，需要添加背景：

背景：无重复滚动0 0 #fff;

两项修改都在上面的代码中，现在可以正常工作。我可能对这个问题有点为时过早，但是现在可以通过这个答案在一个地方找到解决方案！

于 2013-07-10T11:05:07.630 回答
0

你可以用这样的东西达到同样的效果。在所有浏览器中都能正常工作

<!Doctype html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=no,width=device-width,initial-scale=1.0,maximum-scale=1.0"/>
<title>HTML5 Template</title>
<style type="text/css">
#test p {
    display:none;
    margin-top: 25px;
    font-size: 21px;
    text-align: center;
}
</style>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>
<body>
<div id="test"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></div>
<script>
$("#test p").delay(1000).fadeIn("slow");
</script>
</body>
</html>
于 2013-07-10T11:07:35.573 回答