Best way to fix CSS / JS fallout in IE7 when page includes Google Map

Question

I have a page that uses lists <ul>for navigation (Javascript changes the display style or not on the mouse).

This works fine for me except IE6 and IE7 when I have a google map on the page.

In this case, the dropdown menu just doesn't work. However, the page continues to work in FireFox 2.

I did some research and found that this might be an example of IE Select Box Bug, but I'm not sure what Google Map seems to be using <div>, not <iframe>.

Has anyone else encountered a problem like this, and if so, do they have any recommendations on the best way to overcome this problem?

Answer 1

I don’t know if this will fix the problem, but you can try this solution on ccsplay.co.uk , which fixes the menu problem that appears under the drop-down lists. I don't know if this will work, but it's worth it.

Answer 2

I fixed a similar problem with dropdowns not appearing on top of flash movies in IE6 / IE7 / IE8 using this jQuery :

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

Where primary-navis the IDelement of the drop-down container, and footeris the IDlast element on the page. Then I used absolute positioning to move the drop-down lists up to where they belong.

, , , IE , z-index. - Windows Media Player.

Answer 3

, - Active-X, IE 6+ CSS.

, IE- CSS, .

Javascript, CSS , . , . Javascript .

, CSS:

CSS:

, !

Answer 4

Google, - IFrame google.

, ,

ccsplay.co.uk, ​​

. Internet Explorer HACK/Fix , DIV.

JavaScript css IFrame IE6.

JavaScript Google CSS Google (, Google) CSS.

Answer 5

I have no immediate answer for you, but the tools mentioned in this answer (especially IE DOM Inspector) can help.