4X_Pro
Руководитель Проекта
Настоящий Компьютерщик
 Откуда: Москва Всего сообщений: 3031 Рейтинг пользователя: 75 Дата регистрации на форуме: 29 сен. 2001 |
Профиль | ИгнорироватьNEW! Сообщение отправлено: 25 ноября 2006 20:46 Сообщение отредактировано: 27 ноября 2006 14:49
Очень часто при создании сайтов используется эффект наложения изображения при наведении курсора мыши на него. Хотя на первый взгляд, он реализуется предельно просто — замена this.src при наступлении событий onmouserover и onmouseout, но это создает один весьма неприятный эффект: подгрузка изображения с сервера может занять достаточно существенное время (1-2 секунды), что некоторых пользователей почему-то раздражает. Решается эта проблема следующим образом: подгрузка изображений производится в фоновом режиме зараннее (лучше всего — по событию onLoad), и изображение хранится в кеше броузера. Для универсального решения такой задачи я написал следующий код: <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[i].name!='') { imgs[imgs[i].name+'_over'] = new Image(imgs[i].height,imgs[i].width); imgs[imgs[i].name+'_over'].src=imgs[imgs[i].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> Код точно работает в 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)">
---
Каждый человек всегда может найти, чем он может быть полезен окружающим. Проблема только в одном: слишком многие не хотят это искать.
| 
Спасиб