javascript Предварительная загрузка изображений в кеш браузера, организация ролловеров

Задача: Предварительная загрузка изображений
Исходник: Предварительная загрузка изображений, язык: javascript [code #147, hits: 8790]
автор: - [добавлен: 24.05.2006]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">	
<HTML>	
<HEAD>	
<TITLE>Предварительная загрузка изображений</TITLE>	
<script type="text/javascript" language="JavaScript">	
<!--//--><![CDATA[//><!--	
if (document.images) {	
    var img = new Object();	
    img["first"] = new Image(80, 80);	
    img["first"].src = "test.gif";	
    img["second"] = new Image(80, 80);	
    img["second"].src  = "test2.gif";	
    // и так далее...	
}	
//--><!]]>	
</SCRIPT>	
</HEAD>	
<BODY>	
<IMG src="test2.jpg" height="80" width="80" onmouseover="this.src = img['second'].src" onmouseout="this.src = img['first'].src" />	
</BODY>	
</HTML>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">	
<HTML>	
<HEAD>	
<TITLE>Предварительная загрузка изображений</TITLE>	
<script type="text/javascript" language="JavaScript">	
<!--//--><![CDATA[//><!--	
if (document.images) {	
    var img = new Object();	
    img["first"] = new Image(80, 80);	
    img["first"].src = "test.gif";	
    img["second"] = new Image(80, 80);	
    img["second"].src  = "test2.gif";	
    // и так далее...	
}	
//--><!]]>	
</SCRIPT>	
</HEAD>	
<BODY>	
<IMG src="test2.jpg" height="80" width="80" onmouseover="this.src = img['second'].src" onmouseout="this.src = img['first'].src" />	
</BODY>	
</HTML>

В JS проблема решается просто: инициируется новый объект Image и в момент назначения ему src - браузер по указанному адресу запрашивает на сервере картинку.

К коду прилагаются тестовые изображения. Они а также и этот файл можно найти <a href="/data/tasks/76/File/impreload.rar" class=link>здесь</a>.

Тестировалось на: IE 6.0 SP2, Mozilla FF 1.5, Opera 8.5

+добавить реализацию