Предварительная загрузка изображений
Что такое предварительная загрузка изображений и для чего она нужна? Современные сайты интерактивны, то есть реагируют на действия пользователя, выдавая ему нужное в данный момент содержимое без перезагрузки страницы (речь о html-сайтах, а не о flash). Одним из вариантов такой интерактивности является смена картинки, реализуемая при помощи java-скрипта.
Стандартным случаем где требуется смена картинки является меню сайта. Также часто данный элемент реализуется в интерактивной карте-изображении. При наведении курсора на нужный пункт меню или область карты одна картинка заменяется на другую. Новая картинка подгружается в тот момент, когда это востребовано действиями пользователя. Если ширина Интернет-канала маленькая на такую зазгрузку требуется некоторое время, иногда до нескольких секунд если картинка большая. За это время пользователь может отменить действие и перейти к другим элементам веб-страницы. Без всякой интерактивности.
Чтобы пользователь видел то, что для него приготовил вебмастер, необходимо такие картинки загружать предварительно, еще на стадии загрузки страницы. Тогда при наведении курсора картинка будет меняться моментально. Сделать предварительную загрузку нужных изображений легко при помощи простого ява скрипта.
Первым делом создадим функцию, которую назовем например preload_images и опишем ее в заголовке документа (то есть между тегами <head> и </head>). Для этого вставим туда следующий код:
<script language="JavaScript">
<!--
function preload_images() {
var d=document;
if(d.images)
{
if(!d.pr_im)
d.pr_im=new Array();
var i,j=d.pr_im.length,a=preload_images.arguments;
for(i=0; i<a.length; i++)
if(a[i].indexOf("#")!=0)
{
d.pr_im[j]=new Image;
d.pr_im[j++].src=a[i];
}
}
}
//-->
</script>
Теперь нам осталось вызвать эту функцию и передать ей адреса картинок, которые необходимо загрузить. Для этого вставим в открывающий тег <body> код, аналогичный тому что ниже:
<body onload="preload_images('image/1.gif', 'image/2.gif', 'image/3.gif');">
здесь вы можете перечислить все нуждающиеся в предварительной загрузке изображения.
Партнерская программа Nekki - браузерные онлайн игры доля партнера до 50%
|