Доброго времени суток! Прошу у вас о помощи.
Есть у меня горизонтальное меню, которое выпадает при наведении мыши.
Во всех браузерах, естественно, работает все без проблем, а в IE меню реагирует на мышь только пока страница загружается. После загрузки - все, мертво. пункты не открываются, а пункт, который был открыт - обратно не убирается. Подскажите, пожалуйста, как бороться с этим? Вот мое меню и скрипт:
само меню:
<ul id="nav">
<li onMouseOver="javascript:Menu('1','block')" onMouseOut="javascript:Menu('1','none')"><a href="./#">О нас</a>
<ul id="menu_1">
<li><a href="/">Главная</a></li>
<li><a href="/history/">Историческая справка</a></li>
<li><a href="/about/collective/">Педагогический коллектив</a></li>
<li><a href="/about_holiday/">Подготовка к юбилею</a></li>
<li onMouseOver="javascript:Menu('14','block')" onMouseOut="javascript:Menu('14','none')"><a href="./#">Материально-техническая база</a>
<ul id="menu_14">
<li><a href="/about_health/">Здоровье</a></li>
<li><a href="/about_sport/">Спорт</a></li>
<li><a href="/about_event/">Внеурочная деятельность</a></li>
<li><a href="/about_class/">Учебные клабинеты</a></li>
</ul>
</li>
<li><a href="/about_doc/">Нормативно-правовые документы</a></li>
</ul>
</li>
<li><a href="/news/">Новости</a></li>
<li onMouseOver="javascript:Menu('3','block')" onMouseOut="javascript:Menu('3','none')"><a href="./#">Студентам</a>
<ul id="menu_3">
<li><a href="/raspisanie/">Расписание занятий</a></li>
<li><a href="/safety/">Безопасность</a></li>
<li><a href="/exam/">Итоговая аттестация</a></li>
<li><a href="/interesting/">Это интересно, полезно</a></li>
</ul>
</li>
<li onMouseOver="javascript:Menu('4','block')" onMouseOut="javascript:Menu('4','none')"><a href="./#">Родителям</a>
<ul id="menu_4">
<li><a href="/parents_doc/">Нормативно-правовые документы</a></li>
<li><a href="/parents_cons/">Консультации, прием по личным вопросам</a></li>
<li><a href="/ad/">Объявления</a></li>
<li><a href="/parents_board/">Попечительский совет</a></li>
</ul>
</li>
<li onMouseOver="javascript:Menu('5','block')" onMouseOut="javascript:Menu('5','none')"><a href="./#">Педагогам</a>
<ul id="menu_5">
<li><a href="/teach_doc/">Нормативно-правовые документы</a></li>
<li><a href="/teachers_class/">Классное руководство</a></li>
<li><a href="/ad_parents/">Объявления</a></li>
<li><a href="/teach_metod/">Методическая копилка</a></li>
</ul>
</li>
<li onMouseOver="javascript:Menu('6','block')" onMouseOut="javascript:Menu('6','none')"><a href="./#">Мероприятия</a>
<ul id="menu_6">
<li><a href="/events_prev/">Отчет о прошедших</a></li>
<li><a href="/galery/">Фотоотчеты</a></li>
<li><a href="/video/">Видеоотчеты</a></li>
</ul>
</li>
<li onMouseOver="javascript:Menu('7','block')" onMouseOut="javascript:Menu('7','none')"><a href="./#">Обратная связь</a>
<ul id="menu_7">
<li><a href="/send_mail.php">Написать письмо</a></li>
<li><a href="/contacts/">Юридический адрес. Телефоны</a></li>
<li><a href="/forum/">Форум</a></li>
</ul>
</li>
</ul>
и элементарный скрипт
function Menu(id,t)
{
var menu = document.getElementById('menu_' + id).style;
menu.display = t;
menu.display = t;
}
css:
#nav, #nav ul {
z-index: 999999;
list-style: none;
margin: 0;
padding: 0;
border: 1px solid #000;
background: #FFA346;
float: left;
width: 100%;
}
#nav li {
float: left;
position: relative;
z-index: 999999;
}
#nav li ul {
display: none;
position: absolute;
z-index: 999999;
background: #900;
padding: 8px 0;
width: 139px;
font-size: 12px;
}
#nav ul ul {
display: none;
top: 0;
left: 90%;
}
#nav a {
color: #fff;
font-weight: bold;
text-decoration: none;
display: block;
width: 120px;
padding: 4px 10px;
background: #FFA346;
}
#nav li a {
color: #fff;
font-weight: bold;
text-decoration: none;
width: 120px;
padding: 4px 10px;
background: #FFA346;
}
#nav a:hover {
color: #000;
background: #FFC891;
}
#nav li:hover {
color: #666;
background: #640000;
}
#nav li li a {
width: 118px;
background: none;
}
#nav li:hover li ul {
display: none;
width: 138px;
top: -9px;
left: 133px;
}
Заранее благодарю за помощь и терпение!