我有一个非常简单的脚本，可以从页面顶部向下滑动一条消息，然后在几秒钟后将其向上滑动。在 FireFox、Chrome 等中工作正常，但在 IE(6 到 8)中，在 slideUp 完成后，div 在消失之前以全尺寸显示一小会儿，产生令人讨厌的闪光。关于如何摆脱这个的任何想法？
这是完整的页面:
<html>
<head>
<title>Alert Drawer</title>
<script type="text/javascript" src="../jquery.js"></script>
<style>
#drawer {
background-color: yellow;
overflow:visible; position:fixed; left:0; top:0;
text-align:center;
padding:15px; font-size:18px; border-bottom:2px solid #789;
width:100%; display:none; z-index:2;
}
</style>
</head>
<body>
<div id="drawer"></div>
<p>
<br><br><br><br><br><br><br><br>
<a href="#doit">Show the alert drawer!</a>
</p>
</body>
<script type="text/javascript">//<![CDATA[
$(function() {
var drawer = $('#drawer');
$('a').click( function() {
drawer.html("<center>Hey Man!<br>This is a message.</center>");
drawer.slideDown( function() {
drawer.css("backgroundColor", "orange");
setTimeout(function() { drawer.css("backgroundColor", "yellow"); }, 1000);
}
);
setTimeout(function() { drawer.slideUp(); }, 3000);
return false;
});
});
//]]></script>
</html>
最佳答案
简短的回答，这是因为 IE 不知道您的 html 文档的文档类型是什么，因此它会返回以怪癖模式显示它。要删除它，只需通过将以下代码添加到页面的头部来声明您的文档类型。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
要彻底了解此问题并详细了解大多数浏览器将呈现您的页面的两种不同“模式”，请阅读 quirks mode and strict mode在 quirksmode.org .
关于jquery - 摆脱 jQuery/CSS IE slideUp flash？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/1747272/