Клуб API Карт

Нажатие на балун

yuri.netsvetaev
30 апреля 2015, 13:59

Добрый день

Ссылка - www.esencia.ru/test.php

Есть две вкладки - Москва и Санкт-Петербург.

На каждой вкладке отображается своя карта. 

На каждой карте добавлен один балун.

При наведении на балун и нажатии на него отображается содержимое балуна.

 

На вкладке Мосвка, все работает отлично.

На вкладе Санкт-Петербург нажать на балун можно только в том случае если мышка наведена на самый правый край балуна, в ином случае на балун не нажать.

 

Поджскажите где ошибка.

 

Код  страницы ниже:

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

<script src="http://api-maps.yandex.ru/2.1/?lang=ru_RU" type="text/javascript"></script>

<script type="text/javascript">

        ymaps.ready(init_msk);

        var mapMSK;

function init_msk()

        { 

            mapMSK = new ymaps.Map("#Y_MSK", 

            {

                center: [55.75399400, 37.62209300],

                zoom: 10

            }); 

        myPlacemarkM10 = new ymaps.Placemark([55.75399400, 37.62209300], {

            iconContent: "Офис-магазин Москва",

balloonContent: '<b>Метро Пушкинская</b> <br/>Время работы: 9-21 с пн-вс, без выходных'

        }, {

            preset: "islands#redStretchyIcon"

        });

mapMSK.geoObjects.add(myPlacemarkM10);

}

</script>

 

<script type="text/javascript">

        ymaps.ready(init_spb);

        var mapSPB;

function init_spb()

        { 

            mapSPB = new ymaps.Map("#Y_SPB", 

            {

                center: [59.947235, 30.337039],

                zoom: 10

            }); 

        myPlacemarkS10 = new , и maps.Placemark([59.909702,30.316721], {

            iconContent: "Офис-магазин",

balloonContent: '<b>Метро Фрунзенская или Технол. институт</b><br><b>Время работы: 9-21 с пн-вс, без выходных'

        }, {

            preset: "islands#redStretchyIcon"

        });

mapSPB.geoObjects.add(myPlacemarkS10);

}

</script>

 

</head>

 

 

<body class="delivery">

<div>

<h1>Доставка и оплата</h1>

<div class="delivery-types">

<table class="regions">

<tbody>

<tr>

<td data-id="1" class="selected">

<div>Москва<span class="arrow"></span></div>

</td>

<td data-id="2">

<div>Санкт-Петербург<span class="arrow"></span></div>

</td>

</tr>

</tbody>

</table>

 

 

<div data-region="1" class="delivery" style="display: block;">

<div id="#Y_MSK" style="width: 600px;height: 450px"></div>

</div>

 

<div data-region="2" class="delivery" style="display: none;">

<div id="#Y_SPB" style="width: 600px;height: 450px"></div>

</div>

 

 

 

</div>

 

 <style type="text/css">

body.delivery .delivery-types table.regions td{

   list-style:none;

   vertical-align: middle;

padding:5px 10px;

margin:0 2px 0 0;

width:152px;

height:40px;

text-align:center;

vertical-align:middle;

text-transform:uppercase;

background:#e3e3e3;

font-size:14px;

cursor:pointer;

position:relative;

border-radius:12px 0 12px 0;

zoom:1;

position:relative;

}

 

body.delivery .delivery-types table.regions td.selected{

background:#959595;

}

</style>               

 

 

<script type="text/javascript">

$(document).ready(function(){

 

$('body.delivery table.regions td').click(function(){

if (!$(this).hasClass('selected'))

{

$('body.delivery table.regions td.selected').removeClass('selected');

$(this).addClass('selected');

region_id = $(this).attr('data-id');

$('body.delivery div.delivery').hide();

$('body.delivery div.delivery[data-region="'+region_id+'"]').show();

}

});

 

});

</script>

</div>

</body>

</html>

 

 

 

Заранее спасибо за ответ.

1 комментарий
Подписаться на комментарии к посту
Здравствуйте!
Спасибо за сообщение.
Проблема в инициализации из скрытого контейнера.

Постараемся исправить в одном из ближайших релизов.
Пока что можете попробовать добавлять метку на карту после показа контейнера. Это усложняет код, но гарантировано будет работать.