Всем привет
Есть карта сделана средствами sprice и там при наведении на некоторых штатах(у которых есть данные) открывается div со списком городов
на которые можно кликнуть Проблема в том что если вести мышкой внутри этого всплывающего div-а то этот див часто прячется и потом появляется опять
и выглядит все это криво как в FireFox так и IE.
Посмотреть можно здесь
http://www.swedebug.com на карте слева внизу для штата Аляска есть 3 города
И если например вести мышку сверху от верхнего к нижнему городу держа мышку к правой части городов то на 2м городе(который короче по названию)
этот div прячется и появляетмся опять. Подскажите пожалуйста как убрать это мигание дива?
Кратко опишу как это работает :
Сама карта описана так :
<div class="b-map">
<dl id="map" >
<dt><a id="us" href="#nogo" title="us"> <span>United States</span> </a> </dt>
...
<dd id="imgak" onclick="StateSelected('Alaska')" onmouseover="DO_mouseOverHandler(event,'ak')" onmouseout="mouseOutHandler(event)" > <a id="ak" href="#ak" title="Alaska"> <span> Alaska </span> </a> </dd>
...
</dl>
</div>
<div id="div_CitiesOfState" class="filters" style="display:none;right:0;z-index:100;position:absolute;overflow:auto;width:110px;padding:8px 10px;border:solid 1px #ffe28d;background-color:#fff;color:#000;" onmouseover="CitiesOfStateMouseOverHandler()" onmouseout="CitiesOfStateMouseOutHandler(event)"
> </div>
Див div_CitiesOfState - это как раз всплывающий список городов
var timeout = 500;
function DO_mouseOverHandler(e,state_code) { - функция когда мышь над штатом
GlobalStateCode= state_code
GlobalClientX= e.clientX
GlobalClientY= e.clientY
closetimer = window.setTimeout( mouseOverHandler, timeout ); // вызвать обработчик через таймер
}
function mouseOverHandler() {
var id = GlobalStateCode.toUpperCase(); // имя штата
...
var Arr= getCitiesOfState( id ); // Получаем список городов штата и записываем его в див div_CitiesOfState
if ( Arr.length == 0 ) { // Нет городов див прячем
document.getElementById( "div_CitiesOfState" ).style.display= "none";
CurrentStateUnderMouseIndex=-1
isCitiesOfStateShown= false;
return;
}
FillCitiesOfState( id, Arr ); // заполняет див городами выбранного штата
document.getElementById( "div_CitiesOfState" ).style.display= "inline"; // show div list of states
var sx = window.scrollX || document.documentElement.scrollLeft|| 0;
var sy = window.scrollY || document.documentElement.scrollTop|| 0;
mouseX = GlobalClientX + sx
mouseY = GlobalClientY + sy
document.getElementById( "div_CitiesOfState" ).style.left= (parseInt(mouseX)-55)+"px"; // ставим координаты для дива
document.getElementById( "div_CitiesOfState" ).style.top= (parseInt(mouseY)-15)+"px";
...
return;
}
}
}
}
function FillCitiesOfState() { // див штата заполняется в innerHTML тесктом типа:
<span style="cursor:pointer;" onclick="javascript:SelectCity('AK'); " id="a_city_zip_title"><b>Alaska</b></span><br>
<small><a id="a_city_zip_99501" style="cursor:pointer;" onclick="javascript:SelectCity('99501'); " >Anchorage</a></small><br>
<small><a id="a_city_zip_99545" style="cursor:pointer;" onclick="javascript:SelectCity('99545'); " >Bethel</a></small><br>
<small><a id="a_city_zip_99652" style="cursor:pointer;" onclick="javascript:SelectCity('99652'); " >Big Lake</a></small><br>
}