我遇到了jQuery.cycle插件的问题。在页面首次加载(当图像没有被缓存时),它会显示小图像,就像缩略图一样。你可以在以下链接中看到这个问题(编辑:抱歉,旧链接) - 只需等待第二张图像显示 - 它是小的。重新加载/刷新可以解决,但这不是真正的解决方案,你知道。
有人知道这个问题的解决方案吗?非常感谢。
我遇到了jQuery.cycle插件的问题。在页面首次加载(当图像没有被缓存时),它会显示小图像,就像缩略图一样。你可以在以下链接中看到这个问题(编辑:抱歉,旧链接) - 只需等待第二张图像显示 - 它是小的。重新加载/刷新可以解决,但这不是真正的解决方案,你知道。
有人知道这个问题的解决方案吗?非常感谢。
overflow:hidden
。$(window).load(function() { });
而不是 $(document).ready(function() { });
。这是针对IT技术方面的建议,前者会在页面中所有元素都加载完成后再执行函数,而后者则是在DOM树加载完成后立即执行函数。遇到了同样的问题。随机图片会获得 24px x 24px 的内联样式。我没有通过设置每个图像的高度和宽度来解决这个问题,而是通过 CSS 来设置。由于我的宽度是固定的,所以我设置了宽度,但将高度设置为 100%:
.ParentDiv img { width: 400px !important; height: 100% !important; }
!important是必须的,以覆盖jQuery cycle应用的内联样式。
这也似乎解决了我在IE8上遇到的另一个问题。页面加载得很好,但图像似乎是在所有CSS和jquery加载后才加载的。这导致框无法展开以适应其中的图像的高度和宽度。我想设置宽度和高度,箱子中的图像就被正确地大小化了。
我曾经遇到过同样的问题,让我非常困扰!我尝试了预加载图片、检查所有版本等方法,但都没有用。唯一有效的方法是在页面上为每个图片设置宽度和高度,而不是在CSS中设置。
$("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
测试应该解决有故障的24像素占位控件逻辑的问题,.one('load').each()
覆盖了在缓存/远程上的控制流分割。我通过在<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>