Доброго времени, суток коллеги!
Нужна ваша помощь. Задача следующая.
Имеется HTML:
<img id="globe_img" usemap="#globe" src="images/globe_x2.png" width="917" height="953" alt="Глобус">
<map id="globe" name="globe">
<area shape="poly" coords="..." href="#" />
<area shape="poly" coords="..." href="#" />
</map>
<div id="cursor" style="width:100px; height:100px"></div>
DIV #cursor привязан с помощью mousemove() к курсору и двигается вместе с курсором. Сам курсор центрирон относительно дива #cursor что влечет за собой проблему - при наведении курсора на любой элемент не срабатывает события hover(), mousemove() и прочие связанные с мышкой. Как видно из кода, есть карта-изображений и необходимо чтобы срабатывал hover() для #globe_img (областей которые указаны в area) при наведение курсора. Т.е. как я понимаю нужно использовать событие mousemove() для #globe_img и передавать туда координаты курсора, но в mousemove() нельзя передать параметры. Что можете предложить?
Вариант: #globe_img поднять выше #cursor не походит (приведенный тут пример очень упрощен на самом деле все сложнее, но нет смысла вас путать).
P.S.: Вообще я использую библиотеку jQuery, может кто-то и на ней подскажет решение, хотя тут очень специфическая ситуация и я надеюсь что на уровне JS её можно решить.
Буду благодарен за любые решения.