| llgruff | 13.06.2014 08:20 |
Проблема с Google Maps и jQuery UI Tabs на блоге Wordpress (dogshow.me/contact)
Мне нужно на странице контактов (dogshow.me/contact) разместить 2 карты Google с метками, для чего я воспользовался шорткодами jQuery UI Tabs. Поддержка шорткодов уже была интегрирована в тему Wordpress.
Код:
Я столкнулся с проблемой — при открытии скрытой вкладки, на которой 2-ая карта — смещен центр карты далеко влево, хотя он прописан через координаты latitude и longitude. Если обратиться непосредственно к этой вкладке (dogshow.me/contact#tabs-adress-2), то отображение производится нормально и карта центрирована.
Через поисковики и по форумам я нашел некоторые решения этой проблемы. Наиболее часто предлагается решение (slyweb.ru/jquerydoc/tabs-options.php) (stackoverflow.com/questions/1428178/problems-with-google-maps-api-v3-jquery-ui-tabs) :
Также предлагается внесение изменений в javascript (stackoverflow.com/questions/6465239/google-maps-not-centering-because-div-is-displaynone-on-page-load):
К сожалению, моих знаний недостаточно, чтобы решить эту проблему, а эксперименты основанные на советах с форумов результатов не дали. Возможно кто-нибудь сможет помочь с написание или редактированием исходного кода применительно к блогу? (dogshow.me/contact)
Код:
[tabgroup set="adress" titles="Зал на Парке Победы, Зал на Пионерской"] [tab set="adress" position="1"] <strong>Санкт-Петербург. Станция метро Парк Победы. Улица Бассейная, дом 55 (вход со двора)</strong> [hr style=double-line margin_top=35 margin_bottom=0] [googlemap width="880" height="350" src="https://maps.google.ru/maps/ms?hl=ru&gl=ru&ie=UTF8&oe=UTF8&msa=0&msid=215905446834965766922.0004f74f17355880ca38a&t=m&ll=59.866883,30.331407&spn=0.00754,0.037766&z=15&iwloc=0004f74f3e2f9a9378872&output=embed"] [/googlemap][/tab] [tab set="adress" position="2"] <strong>Санкт-Петербург. Cтанция метро Пионерская. Коломяжский проспект, дом 28 (вход со двора)</strong> [hr style=double-line margin_top=35 margin_bottom=0] [googlemap width="880" height="350" src="https://maps.google.ru/maps/ms?hl=ru&gl=ru&ie=UTF8&oe=UTF8&msa=0&msid=215905446834965766922.0004f74f17355880ca38a&t=m&ll=60.012974,30.298662&spn=0.015014,0.075531&z=14&iwloc=0004f74f1aaeb4a1ba9d5&output=embed"] [/googlemap][/tab][/tabgroup]
Я столкнулся с проблемой — при открытии скрытой вкладки, на которой 2-ая карта — смещен центр карты далеко влево, хотя он прописан через координаты latitude и longitude. Если обратиться непосредственно к этой вкладке (dogshow.me/contact#tabs-adress-2), то отображение производится нормально и карта центрирована.
Через поисковики и по форумам я нашел некоторые решения этой проблемы. Наиболее часто предлагается решение (slyweb.ru/jquerydoc/tabs-options.php) (stackoverflow.com/questions/1428178/problems-with-google-maps-api-v3-jquery-ui-tabs) :
Код:
.ui-tabs .ui-tabs-hide {
position: absolute !important;
left: -10000px !important;
display:block !important;
}<script type="text/javascript">
$(function() {
$("#map_link").click(function(event) {
event.preventDefault();
$("#map").slideToggle();
$("#map").html('google_map_iframe_here').css('display','block');
});
});
</script>
К сожалению, моих знаний недостаточно, чтобы решить эту проблему, а эксперименты основанные на советах с форумов результатов не дали. Возможно кто-нибудь сможет помочь с написание или редактированием исходного кода применительно к блогу? (dogshow.me/contact)