I am building a series of sites that all share a menu system, so instead of using Drupal to generate the menu I am pulling in an include with the menu code (the ul). The superfish JS works on every browser except IE6 where the menu acts as if it were only one level deep. Are there any known issues where superfish works as normal on IE7, IE8, FF, Chrome, and Safari but doesn't work at all on IE6?

Comments

mehrpadin’s picture

Hey Ian,

There are z-index issues as mentioned here http://drupal.org/node/1125896 but I guess yours is a "overflow: hidden" issue like this http://drupal.org/node/1138450

orbmantell’s picture

I have seen the z-index issue, and you are correct I am not experiencing that problem. I just checked every level of my menu and surrounding divs, all of them have overflow set to visible. I appreciate the response, but it seems that my problem needs a different solution.

mehrpadin’s picture

Can you please email the URL?

orbmantell’s picture

I am currently running on a localhost dev site, so unfortunately there is no outside access to my problem. On the current live site I am using drupal 6, and the issue does not exist. I am only having trouble on the drupal 7 site I am creating.

hgneng’s picture

Same issue here: (dropdown menu doesn't work on IE6 on Durpal 7) Here is the site:
http://wa.eguidedog.net/zhedu/

Any suggestion?

mehrpadin’s picture

Hey Cameroon,

I don't think you should be worried about IE6, and soon 7 too! take a look at this http://www.w3schools.com/browsers/browsers_explorer.asp :)

hgneng’s picture

Hi mehrpadin,

Thanks for the link! I am afraid that the statistics is quite different in China.

IE6: 22.24%
奇虎360(dure core: IE7 and webkit): 21.82%
IE7: 16.27%

So IE6 + IE7 > 60% in China. Maybe this is one of the reason that Drupal is not so popular in China.

Reference: http://tongji.baidu.com/data/browser

Cameron

hgneng’s picture

I found a not-so-perfect solution but it works for me.

IE 6 seems doesn't support ">" of CSS syntax. There are following lines in superfish.css

.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul {
  left: 0;
  top: 2.5em;
}

So I add following style to ie6.css of my theme.

.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
  left: 0;
  top: 2.5em;
}
mehrpadin’s picture

Yeah, I added those > some time ago when IE6 seemed to be no longer a problem; The original Superfish CSS does not have them, perhaps you should use it:

.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
  left: 0;
  top: 2.5em; /* match top ul list item height */
  z-index: 99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
  top: -999999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
  left:10em; /* match ul width */
  top: 0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
  top: -999999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
  left: 10em; /* match ul width */
  top: 0;
}
gilzero’s picture

Sub.

mehrpadin’s picture

Issue summary: View changes
Status: Active » Closed (fixed)