4X_Pro
Руководитель Проекта
Настоящий Компьютерщик
 Откуда: Москва Всего сообщений: 2994 Рейтинг пользователя: 79 Дата регистрации на форуме: 29 сен. 2001 |
Профиль | Сообщить модератору | ИгнорироватьNEW! Сообщение отправлено: 25 ноября 2006 20:46 Сообщение отредактировано: 27 ноября 2006 14:49
Очень часто при создании сайтов используется эффект наложения изображения при наведении курсора мыши на него. Хотя на первый взгляд, он реализуется предельно просто — замена this.src при наступлении событий onmouserover и onmouseout, но это создает один весьма неприятный эффект: подгрузка изображения с сервера может занять достаточно существенное время (1-2 секунды), что некоторых пользователей почему-то раздражает.
Решается эта проблема следующим образом: подгрузка изображений производится в фоновом режиме зараннее (лучше всего — по событию onLoad), и изображение хранится в кеше броузера. Для универсального решения такой задачи я написал следующий код:
[nocode]
<script type="text/javascript">
var imgs = document.images;
function preload() {
if (imgs) { var count = imgs.length; }
else { var count=0; }
var i=0;
for (i=0; i<count; i++) {
if (imgs.name!='') {
imgs[imgs.name+'_over'] = new Image(imgs.height,imgs.width);
imgs[imgs.name+'_over'].src=imgs[imgs.name].src.replace(/\.(.*?)$/,"_over.$1");
}
}
}
function on(pic) {
pic.src=imgs[pic.name+'_over'].src;
}
function off(pic) {
pic.src=pic.src.replace(/_over\.(.*?)$/i,".$1");
}
</script>
[/nocode]
Код точно работает в MSIE 6, FireFox 1.5, Opera 9. Изображение должно обязательно иметь аттрибут name (это сделано для того, чтобы отделить изображния, являющиеся ссылками/кнопками, от изображений — элементов дизайна), а картинка, появляющееся при наведении — иметь то же имя, но с добавлением _over перед расширением (например, b1.gif и b1_over.gif).
Для корректной работы скрипта нужно повесить вызов функции preload на событие onLoad:
<body onLoad="preload()">
и задать события для самого изображения: <img src="buttons/b1.gif" alt="" onmouseover="on(this)" onmouseout="off(this)">
---
Каждый человек всегда может найти, чем он может быть полезен окружающим. Проблема только в одном: слишком многие не хотят это искать.
| 
Спасиб