我遇到了 jQuery.cycle 插件的问题。在第一次加载页面时（当 imgs 没有被缓存时）它会显示小的 imgs，比如缩略图。你可以在（编辑：对不起，旧链接）看到它——等第二个 img 显示出来——它很小。重新加载/刷新可以解决它，但它不是真正的解决方案，你知道的。
有人知道这个问题的解决方案是什么吗？非常感谢
【问题讨论】：
使用$(window).load(function() { }); 而不是$(document).ready(function() { });
【讨论】：
在图像容器DIV上使用overflow:hidden
【讨论】：
同样的问题。随机图像的内联样式为 24px x 24px。我没有设置每个图像的高度和宽度，而是通过 CSS 进行设置。由于我的宽度是固定宽度，所以我设置了它，但将高度设置为 100%：
.ParentDiv img { width: 400px !important; height: 100% !important; }
!important 是覆盖 jQuery 循环应用的内联样式所必需的。
这似乎也解决了我在使用 IE8 时遇到的另一个问题。该页面可以正常加载，但是在加载完所有 CSS 和 jquery 之后，图像似乎正在加载。这导致框无法扩展以适应其中图像的高度和宽度。我想象设置宽度和高度，保存图像的框立即调整大小。
【讨论】：
我遇到了同样的问题，这让我发疯了！我尝试预加载图像，检查所有内容的版本等均无济于事。似乎解决此问题的唯一方法是在页面上的每张图片上设置宽度和高度，而不是在 css 中。
【讨论】：
我通过在<img> 标签中设置宽度和高度解决了这个问题。但是由于我使用脚本来生成图像列表，并且它们有时具有不同的大小，所以我使用了一点 php 来解决这个问题：
function displayimage($filename) {
$imgsize = getimagesize("$filename");
echo "<img src=\"$filename\" $imgsize[3] />\n";
}
$imgsize[3] 是，例如，width="585" height="285"。
然后，在幻灯片中显示目录中的所有 jpg：
<div class="slideshow">
<?php
foreach (glob("*.jpg") as $filename) {
displayimage($filename);
}
?>
</div>
输出
<div class="slideshow">
<img src="cat.jpg" width="575" height="256" />
<img src="dog.jpg" width="475" height="350" />
<img src="frog.jpg" width="675" height="300" />
</div>
【讨论】：
虽然可能没有直接回答这个问题（jQuery.cycle 插件我不知道），但这里的许多答案都解决了加载后处理图像的问题，这也是人们来这里寻求的。所以这里发生了什么事：
24px 出现是由于浏览器端的错误逻辑 - 过早返回占位符控件的尺寸。它们有不同的控制逻辑来处理缓存的图像，IE 甚至不会为它们触发onload，这就是所有混乱出现的原因。
比(width===0)检查更可靠，如果加载图像，可以在整个互联网上找到，.complete DOM 属性很少提到显然被所有主要浏览器支持：http://www.w3schools.com/jsref/prop_img_complete.asp
这对我有用：
$("img")
.one('load', onLoadRoutine)
.each(function() {
if(!this.complete) {
return; //.one() will fire eventually
} else {
onLoadRoutine({delegateTarget:this}); //fake event object
}
});
注意事件模型对象
{delegateTarget:this}。最好是jQuery(this).trigger('load')，但我不能推荐它，因为我当时没有尝试过......
.complete 测试应该解决错误的 24px 占位符控件的逻辑，.one('load').each()。涵盖缓存/远程的控制流拆分。
【讨论】：