Javascript-форум - Загрузка картинок до их отображения

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Загрузка картинок до их отображения (https://javascript.ru/forum/dom-window/2318-zagruzka-kartinok-do-ikh-otobrazheniya.html)

Загрузка картинок до их отображения

Прошу помощи у знатоков java-script’а.
На главной странице сайта http://pk-kompressor.ru пользователю предлагается выбрать одну из четырёх фирм производителей.
При наведении курсора мыши на любую из логотипов четырёх этих фирм, происходит событие onMouseOver, сменяющее эту картинку на другую.
По идеи, при наведении и убирании курсора мыши на(с) логотип(а), должен получиться эффект «нажимания кнопки».
НО, этот эффект не похож, потому что когда происходит событие onMouseOver, картинка которая должна отобразиться сразу мгновенно, только начитает загружаться из Интернета. А так как её размер около 50 Кбайт, возникает пауза на одну или несколько секунд.

Мне нужен скрипт, чтобы сначала загружались все картинки (i/menu_in.jpg, i/menu1_in.jpg, i/menu2_in.jpg, i/menu3_in.jpg, i/menu4_in.jpg), и только после этого отображалось меню для выбора фирмы-производителя. Только тогда получиться тот самый эффект «нажимания кнопки», который требуется заказчику.

Для удобства, я сделал копию верстки, удалив в ней всё ненужное и выложил для скачивания - http://pk-kompressor.ru/upload/index.zip

Прощу помощи всех, кто может хоть чем-нибудь помочь.

Вопрос не по Javascript!!!!

В вашем случае не подходит то, о чем написано в статье.
После тега <BODY> вставьте следующее:

<span style="top:-500px;left:-500px;position:absolute;display:block;z-Index:-1;">
<img src="../i/menu1_in.jpg">
<img src="../i/menu2_in.jpg">
<img src="../i/menu3_in.jpg">
<img src="../i/menu4_in.jpg">
</span>

PavelPetrov,
и чем же ему то решение не подходит?
если конечно выполнять по байтное копировани е кода, то не подходит, но если хоть немного задействовать мозг и воображение(то, что отличает меня от вас), то мометально приходит идея доработки той статьи.
а конкретно, загружаем рисунок со всеми 4мя вариациями, и проставляем area для всех нелбходимых для обработки участков
это как вариант
HoUsE, у вас рисунки по дофига весят слтшком.
Пэинт их ужимает в два раз пос равнению с вашим
думаю это не предел

Gvozd,

Цитата:

и чем же ему то решение не подходит?

Даже, представить не могу, как на background "повесить" MAP-ы.

И если использовать материалы статьи, то скорее надо сверху вешать прозрачный слой со всеми вытекающими последствиями. А для той верстки, что имеется считаю свой вариант наиболее удачным. Хотя предположу, что не все браузеры его "проглотят".

ЗЫ: тестировал в ИЕ, FF и Опере

Лучше через «CSS Sprites» такие вещи делать без «JavaScript», подобно тому, как описано в статье по ссылке, которую написал ZoNT.

Спасибо, сделал применив статью http://pk-kompressor.ru/index/?page_id=2