690
 

Предварительная загрузка (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 - Большой каталог товаров для спорта и активного отдыха

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

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

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

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

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

Оставить комментарий

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