OnMouseOver, OnMouseOut - не работает Fade

[advokatua]

Есть карта, сделанная через Area shape=poly
Когда наводим на определенную область, то над этой областью появляется картинка этой самой области только закрашенная в красный цвет. Когда убираем курсор с области, то она соотвественно исчезает.

<map id="regions_map" name="regions_map">

<area shape="POLY" coords="210,130,241..." 
onmouseover="switchMap(this, 'visible')" 
onmouseout="switchMap(this, 'hidden')" 
image_id="1" href="#blabla">

</map>

<div class="map_1" id="div_map">
<img name="map_img" id="1" 
style="LEFT: 209px; TOP: 90px" height="78" width="94" src=".../blabla.jpg">  
//Та самая картинка которая появится при наведении курсора на область, 
и таких картинок еще 20 штук с одинаковым именем

<img name="map_img" width="511" height="348" 
usemap="#regions_map" style="LEFT: 5px; visibility: visible; TOP: 5px" src=".../pixel.gif"> 
//прозрачная картинка занимающая всю площадь карты
</div>

<script>
function switchMap(obj, value) {
document.getElementsByName("map_img")[obj.getAttribute("image_id") - 1].style.visibility = value;
}
</script> //скрипт реализующий функцию появления и исчезания области над курсором.

Проблема заключается в том что когда я перевожу курсор от области к области то переход происходит резкий, а надо реализовать это эффектом типа FadeIn FadeOut, но у меня никак не получается получить идентификатор картинки над которой я нахожусь из-за чего єтот Fade не работает.
Т.е. я пытаюсь писать что-то вроде:

$('img#1').fadeIn(100);

но ничерта естественно не выходит. Ошибка я так понимаю в самом получении ID той картинки над которой нахожусь.
+ Проблема еще в том что картинка сама по себе сначала visibility=hidden (в любом случае), а надо что-бы при OnMouseOver она потихоньку появлялась, потом исчезала.

Кто знает как правильно поставить тут запрос на jQuery прошу к столу.

[golishev_S]

Аналогичная ситуация. Буду признателен если кто-то подскажет с ответом.

[Deff]

golishev_S,
фишка такая - обертываем <area> в теги <span>

<span class="wrpArea"> <img class="AreaImg"  style="position:absolute" src="/blabla.jpg">  
      <area shape="POLY" coords="210,130,241...">
</span>

И серфим скриптом по span.wrpArea

На JQ типо так:

$("span.wrpArea").mouseenter(function(){
      $("this).find("AreaImg").stop().fadeIn(100);
}).mouseleave(function(){
      $("this).find("AreaImg").stop().fadeOut(100);
});