Лучший способ исправить выпадающий список CSS/JS в IE7, когда страница содержит Google Map
У меня есть страница, использующая <ul> списки для навигации (Javascript меняет стиль отображения или нет при наведении курсора).
Это работает нормально для меня, за исключением IE6 и IE7, когда у меня есть Google Map на странице.
В этом случае выпадающий просто не работает. Тем не менее, страница продолжает работать в FireFox 2.
Я провел небольшое исследование и обнаружил, что это может быть примером ошибки IE Select Box, но я не уверен, так как карта Google использует <div>не <iframe>,
Кто-нибудь еще сталкивался с проблемой, подобной этой, и если да, то есть ли у них какие-либо рекомендации по наилучшему способу преодоления этой проблемы?
5 ответов
Я не знаю, решит ли это вашу проблему, но вы можете попробовать это решение на ccsplay.co.uk, который решает проблему меню, появляющегося под выпадающими списками. Я не знаю, сработает ли это наверняка, но оно того стоит.
Я полагаю, что это может произойти из-за штук Active-X, который IE 6+ использует для разбора CSS.
Со временем мне пришлось адаптировать свою работу, чтобы включить некоторые хаки IE в мой CSS, чтобы он был совместим с несколькими браузерами.
Сначала я попытался бы создать меню без Javascript, используя чистый CSS и включая упомянутые мной хаки. Это, вероятно, решит вашу проблему. Вам на самом деле не нужен Javascript для изменения стилей при наведении курсора и тому подобное.
Если вы хотите узнать, что такое CSS-взлом: нажмите здесь
Если вы хотите посмотреть примеры CSS-меню: нажмите здесь
Надеюсь это поможет!
Согласно этой ветке Google Maps, вы правы - в код Google вставлен IFrame.
Вам нужно будет использовать решение, которое упомянул Дэн,
Вы можете попробовать это решение на ccsplay.co.uk, который решает проблему меню, появляющегося под выпадающими списками.
В качестве альтернативы см. Internet Explorer HACK/Fix для поля выбора, отображаемого через DIV.
В основном, решение заключается в том, чтобы с помощью JavaScript разместить меню CSS в IFrame в IE6.
Альтернативное решение состоит в том, чтобы использовать JavaScript, чтобы скрыть карту Google, когда меню CSS закрыто, или заменить карту Google статической картой (может быть, даже статическую карту Google), когда меню CSS раскрыто.
Я исправил аналогичную проблему с выпадающими списками, которые не появлялись во флэш-фильмах в IE6/IE7/IE8 с помощью этого jQuery:
$(function () {
$("#primary-nav").appendTo("#footer");
});
куда primary-nav это ID раскрывающегося элемента контейнера и footer это ID последнего элемента на странице. Затем я использовал абсолютное позиционирование, чтобы переместить выпадающие списки обратно на вершину, к которой они принадлежат.
Причина, по которой это работает, заключается в том, что IE уважает порядок расположения источников больше, чем z-index, Однако он все еще не мог отображаться поверх плагина Windows Media Player.
У меня нет для вас немедленного ответа, но инструменты, упомянутые в этом ответе (в частности, IE DOM Inspector), могут помочь.