我使用 YUI 创建了一个简单的网站来制作漂亮的动画图片库。所有浏览器都可以正常工作，但 IE7。我正在按照建议从雅虎服务器加载 YUI。当我第一次加载页面(或按 F5 刷新)时，一旦调用 onload 事件，所有图像都会消失。即使我根本不执行任何 javascript 并且不使用 YUI 库 - 我所有的 img 标签都消失了并且不可见。但是，我仍然可以通过我的 javascript 代码访问它们，它并没有真正破坏我的代码或抛出任何异常。
该问题也部分与 CSS 有关 - 如果您尝试注释掉样式标签，图像将不再消失。
这些页面源代码的一部分仍然构成了复制此问题的网页:
<!DOCTYPE html>
<html>
<head lang="en">
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Title</title>
<style type="text/css">
body, div, table {font-family:Arial,Helvetica,Garuda,sans-serif; color:#777; font-size:14px;}
table {padding:0; margin:0; border-spacing:0;}
td {padding:0; margin:0}
img {border-style:none; padding:0}
#div-main {margin:0 auto; width:970px; position:relative; overflow:hidden}
#div-main-content {position:relative;}
#table-page-content {width:100%; height:374px;}
#td-main-image {vertical-align:top; width:609px; height:374px; padding:0px;}
img.img-main {width:609px; height:374px;}
#td-main-text {vertical-align:top; text-align:left; padding-right:40px;}
#div-gallery-container {width:609px; height:374px; overflow:hidden; position:relative;}
#div-gallery-content {position:absolute; top:0; left:0;}
#div-gallery-content div {width:609px; height:374px;}
#div-gallery-content img {width:609px; height:374px}
</style>
</head>
<body>
<div id="div-main">
<div id="div-main-content">
<table id="table-page-content">
<tr>
<td id="td-main-text">
some text
</td>
<td id="td-main-image" rowspan="1">
<div id="div-gallery-container">
<div id="div-gallery-content">
<div><img src="images/slideshow-01.jpg" class="img-main" alt="image" /></div>
<div><img src="images/slideshow-02.jpg" class="img-main" alt="image" /></div>
<div><img src="images/slideshow-03.jpg" class="img-main" alt="image" /></div>
<div><img src="images/slideshow-04.jpg" class="img-main" alt="image" /></div>
<div><img src="images/slideshow-05.jpg" class="img-main" alt="image" /></div>
<div><img src="images/slideshow-06.jpg" class="img-main" alt="image" /></div>
<div><img src="images/slideshow-07.jpg" class="img-main" alt="image" /></div>
<div><img src="images/slideshow-08.jpg" class="img-main" alt="image" /></div>
<div><img src="images/slideshow-09.jpg" class="img-main" alt="image" /></div>
<div><img src="images/slideshow-10.jpg" class="img-main" alt="image" /></div>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<script src="http://yui.yahooapis.com/2.8.2r1/build/yahoo-dom-event/yahoo-dom-event.js" type="text/javascript"></script>
<script src="http://yui.yahooapis.com/2.8.2r1/build/animation/animation-min.js" type="text/javascript"></script>
</body>
</html>
请帮我解决这个问题。
最佳答案
看来是在IE7浏览器中触发了hasLayout问题，您使用标准解决方案来解决这个问题，
检查IMG标签，并检查LayoutProperties，如果为0，则hasLayout出现在IMG级别，然后应用width:1% or zoom:1 or height:1%
如果问题仍然存在，请尝试将相同的样式应用于父元素
关于javascript - IE7 图像在从服务器加载 YUI 时消失，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5876505/