Как загрузить изображения с помощью CSS/jQuery?

Question

У меня есть большие пальцы 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 под названием 'preload':

<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 использует идентификатор щелкнутого миниатюры до clone() изображений из соответствующего span и отбрасывает их в content с использованием метода html(). Проблема в том, что в галерее есть сто изображений, а не четыре, и уже, если я нажму на один из нижних миниатюр, content div сидит до тех пор, пока ВСЕ другие изображения не будут загружены.

Каков наилучший способ обойти это? Моя первая мысль, может быть, есть способ загрузки очереди или де-очереди? Снимайте большие пальцы, пока не загрузится их содержимое? Уйти с preload в целом в пользу лучшего способа? И если да, то как?

Answer 1

Если вы разместили теги IMG в HTML, браузер загрузит их все, независимо от того, скрыты они или нет. Различные браузеры делают это по-разному, f.ex IE имеет меньше «слотов», чем хром/ff.