есть задача сделать вот такое выпадающее меню
Вопрос: Как????
вот html
<ul id="menu">
<li><a href="#">Главная</a></li>
<li><a href="#">Тренировки</a>
<ul>
<li><a href="#">Кардиотренировки</a></li>
<li><a href="#">Силовые тренировки</a></li>
<li><a href="#">Интервальные</a></li>
<li><a href="#">Круговые тренировки</a></li>
<li><a href="#">Mind Body</a></li>
</ul>
</li>
<li><a href="#null">Отзывы</a></li>
</ul>
вот код CSS
body {
margin: 0;
padding: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:13px;
}
#menu { padding: 0; margin: 0; }
#menu li {
list-style: none;
float: left;
height: 50px;
margin: 0;
/*width: 150px;*/
text-align: left;
background:url(lolita_menu_bg.jpg);
position: relative;
padding: 0;
}
#menu li ul {
list-style: none;
padding: 0;
margin: 0;
display: none;
position: absolute;
left: 0;
top: 50px;
}
#menu li ul li {
float: none;
margin: 0 0 0 2px;
width:200px;
height:30px;
text-align: left;
padding:0;
}
#menu li ul li a {
background: none;
font-size:13px;
font-weight: normal;
padding: 6px 10px 0 10px;
margin:0;
width:180px;
height:24px;
}
#menu li ul li a:hover {
background: none;
font-weight: normal;
padding: 6px 10px 0 10px;
margin:0;
width:180px;
height:24px;
}
#menu li a {
display: block;
/*width: 150px;*/
height: 35px;
color: #AD1C63;
text-decoration: none;
padding: 15px 40px 0 20px;
background: url(lolita_menu_bg_left_border.jpg) left top no-repeat;
font-weight:bold;
font-size:14px;
}
#menu li ul li a:hover {
background: #AD1C63;
}
#menu li ul li a:hover {
color:#FFFFFF;
}
#menu li:hover ul, #menu li.jshover ul {
display: block;
color:#FFFFFF;
}
#menu li:hover, #menu li.jshover {
background: #F1F2F2;
color:#FFFFFF;
}
Использую модуль список ссылок и хочу что бы при добавлении нового пункта и установки галочки на 2 ур. она пошла в выпадающий список.Поиск по форуму ничего не дал.
ПОМОЖИТЕ ЛЮДИ ДОБРЫЕ.
P.S. Кстати меню на чистом CSS. Так что кто успел, у того и есть.
