A melhor maneira de corrigir CSS/JS suspensa no IE7 quando a página inclui Mapa do Google

Question

Eu tenho uma página usando <ul> listas para a navegação (Javascript muda o estilo para exibir ou não no mouseover).

Este é um trabalho muito bem para mim exceto no IE6 e IE7 quando eu tiver um Mapa do Google na página.

Neste caso, o menu drop-down, simplesmente não funciona.No entanto, a página continuará a funcionar no FireFox 2.

Eu tenho feito um pouco de pesquisa e descobri que este pode ser um exemplo do IE Seleccione a Caixa de Erro, mas não tenho certeza de como o Mapa do Google parece estar usando uma <div>, não <iframe>.

Tem mais alguém encontrou um problema semelhante a este, e em caso afirmativo, peça recomendações sobre a melhor forma de ultrapassar este problema?

Answer 1

Eu não sei se isso vai resolver o seu problema, mas você pode querer tentar esta solução, no ccsplay.co.reino unido que corrige o problema de menus que aparecem debaixo de listas drop-down.Eu não sei se ele vai trabalhar, com certeza, mas vale a pena um tiro.

Answer 2

Eu corrigido um problema semelhante com o drop-downs, não aparecem nos filmes de flash no IE6/IE7/IE8 usando este jQuery:

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

Onde primary-nav é o ID da lista drop-down elemento de contêiner e footer é o ID o último elemento na página.Então, usei o posicionamento absoluto para realocar os menus suspensos de volta para o topo onde eles pertencem.

A razão pela qual isso funciona é porque o IE respeita fonte de encomendar mais do que o z-index.Ainda não era capaz de exibir, por cima de um Windows Media Player plugin embora.

Answer 3

Eu acredito que pode acontecer devido a um Active-X coisinha IE 6+ usa para analisar CSS.

Ao longo do tempo eu tive que adaptar o meu trabalho para incluir algumas IE hacks no CSS para ser compatível com vários navegadores.

Em primeiro lugar gostaria de tentar fazer um menu sem Javascript, usando CSS, e incluindo os hacks que eu mencionei.Seria, provavelmente, para resolver o seu problema.Você realmente não precisa de ter o Javascript para alterar os estilos de gerentes e coisas assim.

Se você quiser conferir o que CSS hacking é sobre:clique aqui

Se você quiser conferir algumas pure CSS menu exemplos:clique aqui

Espero que isso ajude!

Answer 4

De acordo com a esse google maps thread, você está correto - de um IFrame é inserido através do google code.

Você vai precisar usar a solução que Dan mencionado,

você pode querer tentar esta solução, no ccsplay.co.reino unido que corrige o problema de menus que aparecem debaixo de listas drop-down

Como alternativa, consulte Internet Explorer CORTE/Correção Para Seleccionar a Caixa, Mostrando através de DIV.

Basicamente, a solução é, usando JavaScript, para colocar o css em um IFrame no IE6.

Uma solução alternativa é usar JavaScript para ocultar o Mapa do Google quando o CSS menu é puxado para baixo, ou para substituir o Google maps com um mapa estático (talvez até um Google mapa estático) quando o CSS menu é puxado para baixo.

Answer 5

Eu não tenho uma resposta imediata para você, mas as ferramentas mencionadas no esta resposta (principalmente o IE DOM Inspector) pode ajudar.