Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Мигает див над участком карты 
:(
    Опции темы
mstdmstd
Дата 19.11.2009, 16:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 394
Регистрация: 30.12.2008

Репутация: нет
Всего: нет



Всем привет
Есть карта сделана средствами 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>
}

PM MAIL   Вверх
bars80080
Дата 19.11.2009, 16:56 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прапор творюет
****
Награды: 1



Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 44
Всего: 315



это следствие того, что слой заполняется городами inline элементами. стилями определите для ссылок внутри блока стиль display: block; всё равно они вертикально расположены

что типа
Код

#a_city_zip_title a { display: block; }


должно помочь. если нет, то надо будет ещё ширину задать и убрать тэги small (вообще не понятно зачем они, если вы можете задать размер шрифта с помощью тех же стилей)
PM MAIL WWW   Вверх
mstdmstd
Дата 19.11.2009, 18:27 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 394
Регистрация: 30.12.2008

Репутация: нет
Всего: нет



Да помогло!
Спасибо большое  smile 
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: для новичков | Следующая тема »


 




[ Время генерации скрипта: 0.0411 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.