HTML+CSS+JavaScript

Имеется изображение с отмеченными областями map.
При наведении курсора на map в этом месте должен появиться другой маленький рисунок (наложеный на первый) а при убирании исчезать.
Всё хорошо, но при появлении рисунка срабатывает onMouseOut, т.к. появившийся рисунок перекрывает map, соответственно рисунок исчезает и курсор оказывается над map, срабатывает onMouseOver, ну и так далее до бесконечности.
Не могу сделать так, что бы map был сверху и одновременно рисунок был виден, ну т.е. что бы появляющийся рисунок не перекрывали map.
Возможно идея бредовая, но мне так надо. Если будут другие варианты реализации, то готов с удовольствием их рассмотреть, но есть некоторые ограничения, например, нужны координаты где будут выводиться рисунки, их много и работа с map очень удобна, т.к. можно прямо мышкой выбирать положение.

Приведите html код ...

var screenM = document.getElementById('screenMap'); function colorTableOver(coords){ x = coords.substring(0,3); y = coords.substring(4,6); screenM.innerHTML = ''; screenM.innerHTML += '<img class=unnamed2 style="left: '+x+'px; top: '+y+'px;" src="ok!.gif" width="20" height="20">';} function colorTableOut(){screenM.innerHTML = '';}

<area shape="circle" coords="319,83,25" onMouseOver="colorTableOver(this.coords)" onMouseOut="colorTableOut()" >

Хм..)) Не понимаю, а в чем проблема ?)

Перенеси onmouseout на появляющуюся картинку :)

Пробовал, не пойдёт, т.к. map круглый, а рисунок квадратный, да и по размеру они могут быть разные.

Введи какую-нить переменную, меняй ее при наведении на разные объекты

var i =0;

Картинку убирай с некоторой задержкой, проверяя значение этой переменной-)

area.onMouseOver:

i=0;

img.onmouseover:

i=1;

area.onmouseout:

if(i!=1) window.setTimeout("colorTableOut()",10)

Можешь добавить onmouseout для верхней картинки )

думаю как-то так )

Тут понятно, что логику onMouseOver на мап-е надо переделывать: "если картинка сверху видима, и если указатель мыши над этой картинкой, то не скрывать её".

Используются offsetLeft , offsetTop для картинки;
Для мыши:
MSIE, Opera 7 - document.body.scrollWidth, document.body.scrollHeight
Netscape, Mozilla - document.width, document.height
IE c доктайпом - document.documentElement.scrollWidth

В общем сделал так:

iOffsetLeft = tOLeft.offsetLeft; iOffsetTop = tOLeft.offsetTop; xMouse = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX; yMouse = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY; if ((xMouse < iOffsetLeft) || ( xMouse > iOffsetLeft+imageSizeX) || ( yMouse < iOffsetTop) || ( yMouse > iOffsetTop+imageSizeZ) ) { screenM.innerHTML = '';}

где imageSizeX и imageSizeZ размеры выводимой картинки
и добавил onMouseOut в выводимую картинку

Спасибо всем, кто помогал!

К document.body.scrollTop нельзя забывать +document.body.offsetHeight - иначе после скролла всё перестанет работать.
Про document.layers можно навсегда твёрдо забыть, он нигде после NN4 не используется, нужно распознавать Мозиллу и Оперу, и про 6-ю версию её тоже забыть.

Не понял смысла предложения:
Про document.layers можно навсегда твёрдо забыть, он нигде после NN4 не используется, нужно распознавать Мозиллу и Оперу, и про 6-ю версию её тоже забыть.

Т.е. document.layers лучше не пользоваться?

Не лучше, а вообще не пользоваться, его не существует.

А как тогда лучше координаты мыши определять?

Вместо вот этого:

xMouse = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX;  yMouse = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY;

Достаточно оставить вот это:

xMouse = document.body.scrollLeft+event.clientX;  yMouse = document.body.scrollTop+event.clientY;

Хотя можешь оставить и так, хуже точно не станет -)

Гооспода!!!
Так ка же всё таки лучше?! То ли так, то ли эдак!? Один говорит "устарело", другой "хуже не станет"...
Может найдём истину... в чём фишлка :

Я же привёл ссылку: pageXOffset, pageYOffset для Мозиллы.

xMouse=document.all?document.body.scrollLeft+event.clientX:pageXOffset; yMouse=document.all?document.body.scrollTop+event.clientY:pageYOffset;

Как узнать величину теущего скрола страницы?
Т.е. надо определить координаты без учёта скрола.

Координаты угла окна?
Здесь всё для IE, по форуму найдёте по кл.словам и для FF. Рис. 9.1. И обязательно уберите DOCTYPE со страницы.

Благодарю, помоголо.

Я передумал -) Пользуй вариант 12345, он прав -)