Как изменить картинку при наведении мышки в теге <AREA>

[uncleman]

Задача трудная блин.
Значит у меня есть картинка "карта мира". карта поделена на сектора и при наведении мышкой на какую-то страну появляется страничка с информацией о выбранной стране. Все это работает.

задача следующая. надо сделать так чтобы при наведении на какую-то страну - это страна подсвечивалась а потом при нажатии мышкой я попадал на информационную страничку.

у меня было два варианта.

1) есть такой обработчик событий onmouseover и onmouseout
отдельно он как бы работает - при наведении мышки скажем темная картинка - при отвода мышки - исходный вариант.

    onMouseOver="this.image.src='1.jpg'"
    onMouseOut="this.image.src='2.jpg'"

но не знаю или его можно впихнуть в мой исходный код:

<IMG SRC="...." ISMAP USEMAP="....">

<MAP NAME="....">
<AREA SHAPE="...." COORDS="...." HREF="germany.html">
<AREA SHAPE="...." COORDS="...." HREF="france.html">
</MAP>

2) второй вариант тоже проделывал не раз
была идея попробывать внедрить фильтр.

onMouseOver="this.filters.alpha.opacity=100"
 onMouseOut="this.filters.alpha.opacity=30"

но тоже не знаю как правильно внедрить его в исходник и вообще можно ли...


вообщем спецы - кто подскажет. как красиво и попроще можно сделать выполненную задачу. может я вообще не в том направлении рою?
заранее спасибо

[Stasik]

имхо самый элегантный способ будет создать много слоёв,в них напихать по одной стране (т.е. только 1 страна, а фон прозрачный), потом через map каждую стану отделить, и потом через alpha.opacity затенять..... но гемороя будет...... ой ой ой....... лучше во флеше

[uncleman]

а на флеше кто тут спец?
писать в новый раздел? или эту тему можна туда перекинуть чтоб не наказывали за дубляж...

[Stasik]

гугл тебе помог.... 2 минуты искал.... читай...... конфигурируй
http://backspace.com/mapapp/
всё сделано для тебя

Читаешь:
http://xs4all.nl/~peterned/csshover.html
Скачиваешь файл:
http://xs4all.nl/~peterned/htc/csshover.htc
и подключаешь его к своему документу:
<!--[if IE]>
<style type="text/css">
body {behavior: url</js/csshover.htc>;}
</style>
<![endif]-->
И после этого имеешь возможность делать :hover практически любому элементу во всех браузерах.

P.S. Хатя такие вещи делаются во Flash.

[Stasik]

liven
и как ты хочешь делать hover кусочкам картинки?

[uncleman]

Stasik
то что там в гугле - просто BEST !!!!!
спасибо и накинул тебе репутЭйшен