2

我有一个拇指div(为简洁起见,我只显示四个拇指):

<div id="thumbs">
<img src="graphics/thumbs/01.jpg" width="190" height="190" class="thumb objects" id="project01" />
<img src="graphics/thumbs/08.jpg" width="190" height="190" class="thumb web" id="project08" />
<img src="graphics/thumbs/14.jpg" width="190" height="190" class="thumb freehand" id="project14"/>
<img src="graphics/thumbs/04.jpg" width="190" height="190" class="thumb freehand objects" id="project04" /></div>

div和一个名为“内容”的空:

<div id="content"></div>

和一个隐藏的div称为“预加载”:

<div id="preload">
<span id="project01_content"><img src="graphics/010.jpg" /></span>
<span id="project02_content"><img src="graphics/022.jpg" /><img src="graphics/021.jpg" /><img src="graphics/023.jpg" /><img src="graphics/020.jpg" /></span>
<span id="project03_content"><img src="graphics/030.jpg" width="450" height="600" /><img src="graphics/031.jpg" width="450" height="600" /></span>
<span id="project04_content"><img src="graphics/040.jpg" width="775" height="600" /><img src="graphics/041.jpg" width="775" height="600" /></span></div>

我认为这是预加载图库中所有图像的好方法。我的 jQuery 使用单击的缩略图的 ID 到clone()相应的图像,并使用该方法span将它们放入。问题是,画廊有一百张图片,而不是四张,如果我点击下面的缩略图之一,在加载之前的所有其他图片之前,它都是空的。contenthtml()content div

解决这个问题的最佳方法是什么?我的第一个想法是也许有一种方法可以排队或取消排队图像加载?调暗拇指,直到他们的内容被加载?干脆放弃,preload转而采用更好的方法?如果是这样,怎么办?

4

1 回答 1

0

如果您IMG在 HTML 中放置标签,浏览器将加载所有标签,无论它们是否隐藏。不同的浏览器以不同的方式执行此操作,f.ex IE 的“插槽”比 chrome/ff 少。

于 2010-08-17T05:18:54.453 回答