У меня есть небольшое приложение Google Map здесь: http://crocdoc.ifas.ufl.edu/projects/saveyourlogo/map/
Эта страница встроена во вкладку "Действия" на этой странице с помощью iframe: http://saveyourlogo.org/en/programs/crocodile/american-crocodile/
С этой страницыначинается с содержимого div "Actions", установленного для отображения: none, моя карта div (#map_canvas) начинается с размера 0x0, и карта не может быть правильно инициализирована.API Карт Google говорит просто использовать google.maps.event.trigger (map, 'resize');как только размер вашей карты div изменится.
Поскольку я не контролирую что-либо за пределами iframe моей маленькой карты, я не могу прикрепить функцию изменения размера к кнопке «Действия».Поэтому я пытаюсь обнаружить изменение размера div #map_canvas, а затем запустить функцию изменения размера.Поскольку (я полагаю) вы обычно не можете прикрепить событие resize к div, я использовал скрипт события jQuery resize Бена Алмана.(StackOverflow не позволяет мне публиковать более двух ссылок, но он легко гуглится.) Говорят, что он работает с IE8, и я видел, что примеры на его сайте делают.
Он отлично работает в Firefox, но событие изменения размера не срабатывает вообще в IE8.(Когда я закомментирую предупреждение о ширине, оно не отображается в IE8.)
function reset_map() {
google.maps.event.trigger(map, 'resize');
map.setCenter(center);
map.setZoom(zoom);
}
$('#map_canvas').resize(function() {
// alert(document.getElementById('map_canvas').offsetWidth);
reset_map();
});
Есть идеи, почему?Или, может быть, предложения для более элегантного решения?
ОБНОВЛЕНИЕ: я попытался создать свой собственный маленький скрипт, который принимает offsetWidth элемента div каждые 300 мс, а затем сравнивает его с последним, но в итоге просто вылетаетбраузер.Есть ли способ обнаружить это изменение с дисплея: нет для отображения: блок без использования постоянного, быстрого цикла?Я знаю, что упомянутый выше сценарий Бена Алмана использует один каждые 250 мс.