Superfish не будет отображаться в IE8 - PullRequest
Новая
       26

Superfish не будет отображаться в IE8

0 голосов
/ 04 декабря 2010

У меня проблема с superfish, из-за которой выпадающее меню вообще не появляется только в IE8. Это проявляется во всем остальном (даже в IE6), но не в IE8. Я вообще не модифицировал исходный JS, и я вызываю div с именем «subnav», где отображается мой список.

То, что ДОЛЖНО случиться, это когда я наведу курсор мыши на элемент меню, он изменит CSS раскрывающегося меню на «видимость: видимый, дисплей: блок» и отобразит меню. В IE8 ничего не происходит, и CSS вообще не изменяется.

Есть идеи, что может быть причиной? Я также использую плагин supersubs для superfish.

Вот CSS: 

#navbar ul{
    margin:10;
    padding:0;
    width:1000px;
}

#navbar li{  
    float:left;  
    color:#191919;  
    list-style-type:none;
    text-transform:uppercase;
    background:transparent url('../images/common/layout/nav-separator.jpg') center right no-repeat;
    padding:10px 0;
}

#navbar li.last{  
    background:none;
}

#navbar ul li a{
    padding: 12px 33px;  
    color: #fff;  
    text-decoration: none; 
}

#navbar ul li a:hover{
    color:#05af0d;
    background:transparent url(../images/common/layout/nav-hover-highlight.png) top center no-repeat;
}

#navbar ul li a.hover-arrow:after{
    margin-left:10px;
    content:url(../images/common/nav-arrow.png);
}

#navbar ul li:hover a.hover-arrow:after{
    margin-left:10px;
    content:url(../images/common/nav-arrow-roll.png);
}

#navbar ul li a.hover-arrow:hover{
    background:#000 url('../images/common/layout/nav-separator.jpg')  right 9px no-repeat;
}

#navbar ul li p{
    margin:0;
    display:inline-block;
}


/*Sub Nav Lists */
.subnav { 
    display:none;
    visibility:hidden; 
}

#navbar ul li ul{
    margin:0; padding:0;    
    position: absolute;   
    left: auto; top: 40px;  
    background: #333;  
    z-index: 99;
}

#navbar ul li ul li{
    background:none;
}

#navbar ul li ul li a{
    padding:0px 3px;  
    display:inline-block;
    margin:0;
    width:150px;
    text-transform:capitalize;
}

#navbar ul li ul li a:hover{
    background-color:#a7a7a7;
    color:#000;
    border:none;
    background-image:none;
    font-weight:bold;
}

Вот как это происходит на странице: 

<div id="navbar">       
   <ul class="topnav">
      <li id="item 1"><p></p>
         <ul class="subnav"></subnav>
      </li>
      <li id="item 2"><p></p>
         <ul class="subnav"></subnav>
      </li>
      etc...
   </ul>
</div>

1 Ответ

0 голосов
/ 29 января 2011

Не уверен, что это решит проблему, которую вы видите, но я заметил в вашем html-фрагменте, что элементы UL с классом subnav не закрываются соответствующим тегом.Первое, что я бы попробовал, это заменить их на:

<ul class="subnav"></ul>

Любые другие ошибки могут не обрабатываться IE8 так же любезно, как другие браузеры.Попробуйте запустить свою страницу через валидатор (например: W3C Markup Validator )

...