Предварительная загрузка (preload) изображений

JavaScript имеет встроенный класс Images, который может быть использован для загрузки изображений. Когда вы создаёте объект Image и устанавливаете его аттрибут src, браузер делает запрос к изображению, которое будет сохранено в кэше (если он конечно не отключен).

Код, который выполняет предварительную загрузку может выглядеть следующим образом:

var imagesList = [
		'flower.jpg','tree.jpg','open.gif','close.gif',
		'folder.gif','minimize.gif','maximize.gif','exit.png'
];

var aImages = [];
for (var i = 0, len = imagesList.length; i < len; i++) {
	aImages[i] = new Image();
	aImages[i].src = imagesList[i];
}

Здесь, imagesList это список изображений, которые нужно загрузить, а aImages - массива объектов Image, которые будут использоваться для загрузки.

В браузере Opera может возникнуть проблема если вы используете событие onload для изображений - если присваиваемое значение свойства Image.src уже имеется в одном из изображений на странице, то Opera не будет выполнять событие onload для них.

Maklay.com - Большой каталог товаров для спорта и активного отдыха
  • http://www.jstoolbox.com/2008/05/20/avtomatizirovannaya-podgruzka-izobrazhenij-v-jquery/ Автоматизированная подгрузка изображений в jQuery | JSToolbox – все о JavaScript

    [...] aImages[i].src = imagesList[i]; } Подробнее об этом примере смотрите здесь.Как видите, здесь нужно самому добавлять изображения [...]

  • http://www.a-piskunov.ru Smile42RU

    Итс гуд, 2 года делаю сайты и вот понадобилось сделать прелоадер в первый раз)
    Спасибо.

  • Alex

    А пацаны говорят, что это работате только в Gecko:
    http://webew.ru/articles/580.webew

  • admin

    А по-моему это работает везде. Я неоднократно пользовался и никогда проблем небыло.

JSToolbox создан на основе WordPress