Der beste Weg, das CSS/JS-Dropdown in IE7 zu beheben, wenn die Seite Google Map enthält

Question

Ich habe eine Seite mit <ul> Listen für die Navigation (Javascript ändert den Stil so, dass er bei Mouseover angezeigt wird oder nicht).

Das funktioniert gut für mich außer in IE6 und IE7, wenn ich eine Google Map auf der Seite habe.

In diesem Fall funktioniert das Dropdown einfach nicht.Die Seite funktioniert jedoch weiterhin in Firefox 2.

Ich habe ein wenig recherchiert und herausgefunden, dass dies ein Beispiel für den IE Select Box Bug sein könnte, bin mir aber nicht sicher, da Google Map offenbar einen verwendet <div>, nicht ein <iframe>.

Ist jemand anderes auf ein ähnliches Problem gestoßen, und wenn ja, hat er Empfehlungen, wie dieses Problem am besten gelöst werden kann?

Answer 1

Ich weiß nicht, ob dies Ihr Problem beheben wird, aber vielleicht möchten Sie es versuchen Diese Lösung finden Sie unter ccsplay.co.uk Dadurch wird das Problem behoben, dass Menüs unter Dropdown-Listen angezeigt werden.Ich weiß nicht, ob es sicher funktionieren wird, aber es ist einen Versuch wert.

Answer 2

Ich habe damit ein ähnliches Problem behoben, bei dem Dropdowns nicht über Flash-Filmen in IE6/IE7/IE8 angezeigt wurden jQuery:

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

Wo primary-nav ist der ID des Dropdown-Containerelements und footer ist der ID des letzten Elements auf der Seite.Ich habe dann die absolute Positionierung verwendet, um die Dropdown-Listen wieder nach oben zu verschieben, wo sie hingehören.

Der Grund dafür ist, dass der IE die Quellreihenfolge mehr respektiert als die z-index.Es konnte jedoch immer noch nicht über einem Windows Media Player-Plugin angezeigt werden.

Answer 3

Ich glaube, dass das an einem Active-X-Ding liegen könnte, das IE 6+ zum Parsen von CSS verwendet.

Im Laufe der Zeit musste ich meine Arbeit anpassen, um einige IE-Hacks in mein CSS zu integrieren, damit es mit mehreren Browsern kompatibel ist.

Ich würde zunächst versuchen, ein Menü ohne Javascript zu erstellen, reines CSS zu verwenden und die von mir erwähnten Hacks einzubeziehen.Es würde wahrscheinlich Ihr Problem beheben.Sie benötigen eigentlich kein Javascript, um Stile beim Mouseover und dergleichen zu ändern.

Wenn Sie herausfinden möchten, worum es beim CSS-Hacking geht:klicken Hier

Wenn Sie sich einige reine CSS-Menübeispiele ansehen möchten:klicken Hier

Hoffe das hilft!

Answer 4

Entsprechend dieser Google Maps-Thread, Sie haben Recht - ein IFrame wird durch den Google-Code eingefügt.

Sie müssen die von Dan erwähnte Lösung verwenden:

Vielleicht möchten Sie es versuchen Diese Lösung finden Sie unter ccsplay.co.uk Dadurch wird das Problem behoben, dass Menüs unter Dropdown-Listen angezeigt werden

Alternativ siehe Internet Explorer HACK/Fix für Auswahlfeld, das über DIV angezeigt wird.

Grundsätzlich besteht die Lösung darin, mithilfe von JavaScript Ihr CSS-Menü in einem IFrame in IE6 zu platzieren.

Eine alternative Lösung besteht darin, JavaScript zu verwenden, um die Google Map auszublenden, wenn das CSS-Menü heruntergezogen wird, oder die Google Map durch eine statische Karte (vielleicht sogar eine statische Google-Karte) zu ersetzen, wenn das CSS-Menü heruntergezogen wird.

Answer 5

Ich habe keine sofortige Antwort für Sie, aber die in genannten Tools diese Antwort (insbesondere der IE DOM Inspector) kann hilfreich sein.