IE7殺死我的jQuery下拉主導航菜單

Question

上

下拉掩蓋了其他項目在IE7

http://southasianlitfest.com

CSS

#nav 
{ 
    _height:57px; 
    float:left; 
    min-height:57px; 
    padding-top:15px; 
    width:960px; 
} 

#nav ul#pages 
{ 
    float:left; 
} 

#nav ul#pages li 
{ 
    float:left; 
    text-transform:uppercase; 
} 

#nav ul#pages li .sub-menu 
{ 
    -moz-border-radius:5px; 
    -moz-box-shadow:0 0 10px #8F8675; 
    -webkit-border-radius:5px; 
    -webkit-box-shadow:0 0 10px #8F8675; 
    background:#FFF; 
    border:1px solid #DB1A14; 
    border-radius:5px; 
    display:none; 
    padding:0 3px; 
    z-index:3; 
} 

#nav ul#pages li .jquery.sub-menu 
{ 
    -moz-border-radius:0; 
    -moz-border-radius-bottomleft:5px; 
    -moz-box-shadow:-1px 1px 2px #8F8675; 
    -webkit-border-bottom-left-radius:5px; 
    -webkit-border-radius:0; 
    -webkit-box-shadow:-1px 1px 2px #8F8675; 
    background:transparent; 
    border-bottom-left-radius:5px; 
    border-radius:0; 
    border-right:none; 
    border-top:none; 
    clear:left; 
    margin-left:3px; 
    position:absolute; 
} 

#nav ul#pages li .jquery.sub-menu .submenu 
{ 
    background:#F19422; 
} 

#nav ul#pages li .jquery.sub-menu li 
{ 
    clear:none; 
    float:left; 
} 

#nav ul#pages li .jquery.sub-menu li a 
{ 
    color:#fff; 
} 

#nav ul#pages li.sub_selected a 
{ 
    color:#EA583A; 
} 

#nav ul#pages li.has_submenu:hover ul,#nav ul#pages li.has_submenu .sub-menu:hover 
{ 
    display:none; 
} 

#nav ul#pages li:hover ul,#nav ul#pages li .sub-menu:hover 
{ 
    display:block; 
} 

#nav ul#pages li ul li 
{ 
    clear:left; 
} 

#nav ul#pages li ul li a 
{ 
    color:#5B6384; 
} 

#nav ul#pages li ul li a:hover 
{ 
    color:#000; 
    text-decoration:none; 
} 

#nav ul li 
{ 
    display:inline; 
    padding-right:25px; 
} 

#nav ul#pages li .sub-menu li a:hover,#nav ul#pages li .jquery.sub-menu li a.selected 
{ 
    color:#DD2522; 
} 

JS

//function for hover submenus 
    menu_items = $('#nav #pages li'); 
    submenus = $('#nav #pages li ul.sub-menu'); 
    submenu_pointers = $(submenus).siblings('a'); 
    submenus_parents = $(submenus).parent(); 




    $(submenus_parents).hover(function(){ 
      hovered = $(this).data('hovered'); 
      pointer = $(this).children('a'); 
      menu = $(this).children('.sub-menu'); 

      this_parent = $(this).parent(); 
      if($(this_parent).hasClass('sub-menu')){ 
       $(submenus).filter(this_parent).stop(true,true).hide().data('hovered', false); 
      } else { 
       $(submenus).hide().data('hovered', false); 
      } 


      if(!hovered){ 

       $(this).data('hovered', true); 
       rotatePointer(submenu_pointers,'up'); 
       $(menu).stop(true,true).slideDown(300); 
       rotatePointer(pointer,'down'); 


      } else { 
       $(this).data('hovered', false); 
       $(menu).delay(1000).stop(true,true).slideUp(300); 
       rotatePointer(pointer,'up'); 

      } 



     }); 

Answer 1

嘗試設置子菜單的包含LI的位置：

#nav ul#pages li 
{ 
    float:left; 
    text-transform:uppercase; 
    position:relative; 
}