Лучший способ исправить выпадение CSS/JS в IE7, когда страница содержит Google Map

Question

У меня есть страница с использованием списков навигации для <ul> (Javascript меняет стиль на отображение или нет при наведении курсора мыши).

Это отлично работает для меня за исключением в IE6 и IE7, когда у меня есть карта Google на странице.

В этом случае выпадающее меню просто не работает. Тем не менее, страница продолжает работать в FireFox 2.

Я провел небольшое исследование и обнаружил, что это может быть пример IE Select Box Bug, но я не уверен, что, как представляется, Google Map используя <div>, а не .

Неужели кто-то еще столкнулся с проблемой, подобной этому, и если да, то у них есть рекомендации по наилучшему способу преодоления этой проблемы?

Answer 1

Я не знаю, исправит ли это вашу проблему, но вы можете попробовать this solution at ccsplay.co.uk, который устраняет проблему с появлением меню под раскрывающимися списками. Я не знаю, будет ли это работать, но это стоит того.

Answer 2

У меня нет немедленного ответа для вас, но инструменты, упомянутые в this answer (особенно IE DOM Inspector), могут помочь.

Answer 3

Я установил аналогичные проблемы с раскрывающимися спадами не появляются над флешками в IE6/IE7/IE8 с помощью этого jQuery:

$(function() { 
    $("#primary-nav").appendTo("#footer"); 
}); 

Где primary-nav является ID из выпадающего элемента контейнера и footer является ID последнего элемента на странице. Затем я использовал абсолютное позиционирование, чтобы переместить выпадающие списки наверх, где они принадлежат.

Причина этого в том, что IE уважает исходный порядок больше, чем z-index. Тем не менее, он все еще не смог отображать поверх плагина Windows Media Player.

Answer 4

Я считаю, что это может произойти из-за Active-X, который IE 6+ использует для разбора CSS.

Со временем мне пришлось адаптировать мою работу, чтобы включить некоторые IE-хаки в мой CSS, чтобы она была совместима с несколькими браузерами.

Сначала я попытался создать меню без Javascript, используя чистый CSS и включив в себя хаки, о которых я упоминал. Вероятно, это исправить вашу проблему. На самом деле вам не нужен Javascript для изменения стилей при наведении курсора мыши и тому подобное.

Если вы хотите узнать, что CSS хакерство о: нажмите here

Если вы хотите, чтобы проверить некоторые примеры меню чистого CSS: нажмите here

Надеются, что это помогает!

Answer 5

Согласно this google maps thread, вы верны - IFrame вставляется в код google.

Вы должны будете использовать решение, которое упоминается Dan,

вы можете попробовать this solution at ccsplay.co.uk, который исправляет проблему меню, появляющееся под раскрывающимися списками

В качестве альтернативы, см Internet Explorer HACK/Fix For Select Box Showing through DIV ,

В основном решение с использованием JavaScript помещает ваше меню css в IFrame в IE6.

Альтернативным решением является использование JavaScript для скрытия Карты Google при смене меню CSS или замена карты Google на статическую карту (возможно, даже статическую карту Google) при отключении меню CSS.