Я работаю над выпадающим meenu, который исчезает в IE 8. Работает отлично в firefox и chrome, но не в IE8. я googled в течение двух дней и сделал много изменений, но все еще не работает в IE. Вот код для CSS.Выпадающее меню исчезает в IE8
.dropdownmenu li, .dropdownmenu li ul
{
display: block;display:inline;float:none;
}
dropdownmenu ul:hover , .dropdownmenu ul li:hover
{
display: block;display:inline; float:none;
}
.dropdownmenu{
border:none;
border:0px;
margin:0px;
padding:0px;
font: 37.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color:#ffffff;
}
.dropdownmenu ul{
background:#333333;
height:35px;
list-style:none;
margin:0;
padding:0;
}
.dropdownmenu li a.top_link span {color:#ffffff;font-size:11px;}
.dropdownmenu li{
color: #FFFFFF;
font-size:11px;
float:left;
padding:0px;
}
.dropdownmenu li a{
background:#333333 url("dropdown/seperator.gif") bottom right no-repeat;
color:#ffffff;
display:block;
font-weight:normal;
line-height:35px;
margin:0px;
padding:0px 11px;
text-align:center;
text-decoration:none;
}
.dropdownmenu li a:hover{
background: #2580a2 url("dropdown/hover.gif") bottom center no-repeat;
color:#FFFFFF;
text-decoration:none;
}
.dropdownmenu li ul{
color:#ffffff;
font-size:10px;
background:#333333;
display:none;
height:auto;
padding:0px;
margin:0px;
border:0px;
position:absolute;
width:auto;
z-index:200;
/*top:1em;
left:0;*/
}
.dropdownmenu li:hover ul{
display:block;
float:left;
}
.dropdownmenu li li {
background:url('dropdown/sub_sep.gif') bottom left no-repeat;
display:block;
float:none;
margin:0px;
padding:0px;
width:auto;
}
.dropdownmenu li ul a{
display:block;
height:35px;
font-size:12px;
color:#ffffff;
font-style:normal;
margin:0px;
padding:0px 10px 0px 17px;
text-align:left;
}
.dropdownmenu li ulli a:hover{
display:block;
background:#2580a2;
color:#ffffff;
text-decoration:none;
}
Вот код PHP, я использовал <?include ('dropdown.php')?>
на моем сайте, чтобы включить это в CMS встроенный веб-сайт.
<link rel="stylesheet" href="dropdown/dropdown3.css" type="text/css" />
<ul class="dropdownmenu">
<li ><a href="?category_id=140" class="top_link"><span>Home & Garden <img src="dropdown/down.gif"></span></a>
<ul class="sub">
<li><a href="?category_id=145">ArtWork</a></li>
<li><a href="?category_id=146">Bedding & Bath</a></li>
<li><a href="?category_id=150">Kitchen & Dining</a></li>
<li><a href="?category_id=151">Patio, Lawn & Garden</a></li>
<li><a href="?category_id=152">Pet Supplies</a></li>
<li><a href="?category_id=153">Sewing, Craft & Hobbies</a></li>
<li><a href="?category_id=154">Vacuum, Cleaning & Storage </a></li>
</ul>
</li>
</ul>
Что еще я могу сделать, чтобы исправить это в IE?
Кроме того, когда выпадающее меню зависло, он отображает цвет фона # 2580a2, который можно увидеть на .dropdownmenu li a:hover
. Эта особенность не отображается в хроме. Что может быть причиной?
Вы могли бы хотеть, чтобы получить возможность отправлять больше кода, так как это не кажется полным. См. Здесь: http://jsfiddle.net/sRqJ8/ (единственное отличие в том, что я завернул внешний список с помощью UL) –
http://jsfiddle.net/sRqJ8/3/. Я обновил его. Но я не могу получить синий фон в раскрывающемся списке для работы в хроме? –
Я изменил '.dropdownmenu li ulli a: hover' на' .dropdownmenu li ul li: hover', чтобы исправить зависание в Chrome. См. Http://jsfiddle.net/HRSSF/. Меню также работает в IE8 – jao