Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Общие вопросы > Предварительная загрузка изображений


Автор: Aliance 23.9.2005, 14:04
Задача:
Необходимо создать эффект предварительной загрузки изображения в кеш браузера, например, для rollover-картинок.

Решение:
Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>Предварительная загрузка изображений © AlianceHTMLEditor [ http://editor.sut.net.ru/editor.html ]</TITLE>
<script type="text/javascript" language="JavaScript">
<!--//--><![CDATA[//><!--

if (document.images) {
    var img = new Object();
    img["first"] = new Image(80, 80);
    img["first"].src = "img/1.jpg";
    img["second"] = new Image(80, 80);
    img["second"].src  = "img/2.jpg";
    // и так далее...
}

//--><!]]>
</SCRIPT>
</HEAD>

<BODY>

<IMG src="img/1.jpg" height="80" width="80" onmouseover="this.src = img['second'].src" onmouseout="this.src = img['first'].src" />

</BODY>
</HTML>


Обсуждение:
Мы создаем объект img, и присваиваем его полям (в данном примере first, second) картинку, путем создания объекта картинки (new Image(height, width)), затем каждому полю (объекту-картинки) присваеваем свойство src.

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)