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

Question

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

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

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

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

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

Answer 1

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

Answer 2

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

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

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

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

Answer 3

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

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

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

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

Если вы хотите ознакомиться с некоторыми примерами чистого CSS-меню:щелчок здесь

Надеюсь, это поможет!

Answer 4

Согласно эта ветка Google Maps, вы правы - IFrame вставляется кодом Google.

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

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

В качестве альтернативы смотрите ВЗЛОМ Internet Explorer / Исправление для отображения поля выбора через DIV.

По сути, решение заключается в том, чтобы, используя JavaScript, разместить ваше css-меню в IFrame в IE6.

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

Answer 5

У меня нет для вас немедленного ответа, но инструменты, упомянутые в этот ответ (в частности, инспектор IE DOM) может помочь.