Карта Bing в диалоговом окне jQuery неправильно отображается только в IE8/9

У меня есть диалоговое окно jQuery, которое появляется для отображения карты Bing (вид с высоты птичьего полета) на веб-сайте недвижимости, который я создаю. По какой-то причине карта с высоты птичьего полета отлично работает в Firefox, Chrome и Safari, но не в IE8 или IE9.

Например, вы можете просмотреть эту страницу:

http://www.nhfinehomes.com/Property/Detail/4126470

Вид с высоты птичьего полета — кнопка справа вверху. Пытаюсь понять это уже несколько дней. Когда диалоговое окно открывается, карта представляет собой небольшую квадратную часть диалогового окна, а не полное диалоговое окно.

Я попытался сделать карту фиксированной ширины внутри диалогового окна (просто чтобы посмотреть, сработает ли это), но все равно не повезло.

Я думаю, что мне нужно запустить какое-то обновление, когда откроется диалоговое окно, но я не могу определить, что это должно быть.

ТИА


person darensanborn    schedule 22.03.2012    source источник


Ответы (1)


проблема определенно в размерах. Я проверил html-код карт Bing в диалоговом окне пользовательского интерфейса jQuery, и в Chrome он отображается нормально. Однако в IE родительский элемент <div>, на котором размещены фрагменты карты, имеет подозрительно маленькие размеры, что кажется неправильным. Похоже, что когда jQuery UI JavaScript выполняет и изменяет элемент DOM, в котором размещается ваша карта, что-то должно было пойти не так в IE, чтобы привести к тому, что элемент управления картами bing потерял свои шарики в отношении того, насколько большим он должен быть. Я заметил, что вы оставили диалоговое окно пользовательского интерфейса jQuery с изменяемым размером, и когда я попытался изменить размер диалогового окна, карта, кажется, исправляет себя и отображается правильно.

Поэтому в качестве обходного пути попробуйте изменить размер диалогового окна в событии открытия диалогового окна, чтобы имитировать изменение размера. Это может иметь тот же эффект, что и изменение размера, инициированное пользователем, и вызвать самокоррекцию карты. Что касается более элегантного исправления, мне трудно сказать, так как у меня нет исходного кода передо мной. Но я бы начал с попытки установить ширину и высоту карты с помощью JavaScript после того, как вы настроите свой диалог, вместо того, чтобы рассчитывать на поведение по умолчанию и посмотреть, работает ли это.

person Bojin Li    schedule 22.03.2012
comment
Спасибо за идеи. Я попытался изменить размер диалогового окна jQuery непосредственно перед открытием, а также сразу после открытия. К сожалению, ни один из них не работал. Кроме того, я не вижу, чтобы он работал правильно при ручном изменении размера окна. - person darensanborn; 24.03.2012
comment
@darensanborn Хм, это странно. Я использовал IE 9, и ручное изменение размера, казалось, исправило это. - person Bojin Li; 25.03.2012