Главная страница статей --> Хитрости при программировании php, заметки по базам данных

Предзагрузка картинок

Источник: realcoding.net

Иногда, в процессе разработки сайта, возникает ситуация, когда необходимо использовать несколько изображений на странице, которые поочереди сменяют друг друга, при этом страница не обновляется. Для этого используется предзагрузка изображений, которая позволяет загрузится изображениям в самом начале основного текста страницы.

На самом деле, предзагрузка выполняется удивительно просто. В самом начале страницы вставляется небольшой скрипт:

<script language=JavaScript>
pic = new Image();
pic.src=test.jpg;
</script>

где test-jpg – предзагружаемая картинка, которая не отображается на странице, но в любой момент ее можно отобразить без дополнительного ожидания загрузки изображения.

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

<script language=JavaScript>
pic = new Image();
pic.src=sea_2.jpg;
</script>

<img src=sea_1.jpg style=cursor: hand onclick=this.src=pic.src>
<img src=sea_1.jpg style=cursor: hand onclick=this.src=sea_3.jpg>

Изображения sea_2.jpg и sea_3.jpg абсолютно идентичны, но изображение sea_2.jpg уже хранится в переменной pic.

При нажатии на первую картинку, другая картинка отобразится моментально, так как она уже загружено, при нажатии на вторую – придется некоторое время подождать, пока она будет загружено



Похожие статьи:
- Контекстная реклама – что это такое?
- Как заставить AJAX читать между строк
- Красивый код на PHP
- Преобразование гиперссылок средствами сервера Apache
- IPv6: расширение протокола IP
- Анимационное подчеркивание
- Сервисы в помощь оптимизатору
- Установка и настройка Apache сервера
- PageRank от Google
- Алгоритм расчета PageRank
- Кроссбраузерное выравнивание по центру
- Изменение фона в таблице
- CSS от А до Я


Оглавление | Обсудить на форуме | Главная страница сайта | Карта сайта |

Контакты
Редакция:
[0.001]