По ходу сайт уже был готов http://www.pkspo.spb.ru/
Но сегодня пришла клиентка и нагрузила меня еще кучей информации, которую нужно выложить на сайт, изменив меню.
Вроде всего лишь... добавить к всем меню, сделать все выпадающие... Это и стало камнем преткновения.
Смотрела готовые меню, но переделывать сейчас, когда все уже готово, и принято, нельзя. Не поймут.
Посему опять прошу вашей помощи: (меню можно посмотреть по ссылке выше.)
Задача: Сделать меню все выпадающие.
Вот код яваскрипт:
| Код |
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;
|
| Код |
UL {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 120px; height:20px; BORDER-BOTTOM: #ccc 1px solid; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}
UL LI {
POSITION: relative
}
LI UL {
DISPLAY: none; bottom: 200px; POSITION: absolute; TOP: 20px
}
UL LI A {
BORDER-RIGHT: #ccc 1px solid; PADDING-RIGHT: 5px; font-style:bold;font-weight:bold; BORDER-TOP: #ccc 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: white; PADDING-BOTTOM: 5px; BORDER-LEFT: #ccc 1px solid; COLOR: #363C6B; PADDING-TOP: 5px; BORDER-BOTTOM: #ccc 0px solid; TEXT-DECORATION: none
}
HTML UL LI {
FLOAT: left; HEIGHT: 1%
}
HTML UL LI A {
HEIGHT: 1%
}
UL LI A:hover {
BACKGROUND: white; COLOR: #A78E48; text-decoration:underline; font-style:bold;font-weight:bold
}
LI UL LI A {
PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px
}
LI:hover UL {
DISPLAY: block
}
LI.over UL {
DISPLAY: block
}
|
Вот код того меню, который сейчас выложен на сайте.
| Код |
<html>
<head>
<META content="MSHTML 6.00.2900.2180" name=GENERATOR></HEAD>
</head>
<table cellpadding="0" cellspacing="0" width=100% align=center>
<tr><td> </td>
<td class=4 width=150><a href=index.php?page=about class=1>Главная</a>
</td>
<td align=center width=150><ul id="nav"><li><a href="#"><b>Специальности</b></a><ul>
<li><a href="index.php?page=about&id=2">Правоведение (030503)</a></li>
<li><a href="index.php?page=about&id=3">Право и организация социального обеспечения (030504)</a></li>
<li><a href="index.php?page=about&id=4">Социальная педагогика (050711)</a></li>
<li><a href="index.php?page=about&id=5">Реклама (032401)</a></li>
</ul>
</td>
<td class=4 width=150><a class=1 href=index.php?page=student>Отличники СПО</a></td><td width=15> </td>
<td class=4 width=150><a class=1 href=index.php?page=forum>Форум</a></td><td width=15> </td>
<td class=4 width=150><a class=1 href=index.php?page=about&id=6>Досуг</a></td><td> </td>
</tr>
</table>
|
Кто может или знает как исправить ситуацию, помогите пожалуйста. 
Может проблема в том что id=nav нужно увеличивать? У первого меню id=nav0, у второго id=nav1.........  |
