Динамическое выпадающее меню на PHP
Меню на CSS. Выпадающее меню на CSS.
Динамическое активное меню CSS с использованием PHP. Без java.
Чесно говоря не хочется все разъяснять. Но по опыту знаю
лучше коментить, а то человек который глянет с 1 раза не хрена не поймет.
CSS динамического выпадающего меню на PHP
.menu
{ float:left;
width:190px;}
.menu ul
{
display:block;
list-style:none;
margin-left:-35px;
position:relative;
background:#515151;
background:none;
}
.menu ul li ul li a //Свойство ссылок внутри меню-списка-списка.
{
border:1px #609 solid;
margin: 5px; //Отступ текста внутри блока ссылки
display:block; //Ссылка блоком
padding: 2px 6px;
text-decoration: none; //Убираем подчеркивание
-moz-border-radius: 10px;
border-radius: 10px; //Закругленные бордюры ссылок
width:150px;
}
.menu ul li ul li a:hover //поведение ссылки при наведении на нее мышкой (у меня меняется фон и цвет тектста)
{ background:#033 ;
color:#CF3;}
.pad ul //Скрываем меню внутри списка pad
{display:none;}
.pad:hover ul //Открываем при наведении на список pad скрытые строки
{display:block;}
.pad_b ul //В случае нажатия меняем класс в PHP на pad_b
{display:block;}
.active //Цвет и форма активных ссылок. Тех ссылок в котором находишься.
{
display:block;
padding: 2px 6px;
text-decoration: none;
border:1px #609 solid;
-moz-border-radius: 10px;
border-radius: 10px;
margin: 5px;
background: #6FC no-repeat;
color:#C03;
}
.no_active_pad //Цвет не активных выпадающих строк меню
{ background: #FCC;}
.active:hover //Поведение активной ссылки при наведении
{
border:1px solid #FF0;
padding: 2px 6px;
background:#033 ;
-moz-border-radius: 10px;
border-radius: 10px;
color:#CF3;
display:block;
margin: 5px;
}
.no_active:hover //Поведение не активной ссылки при наведении
{
border:1px solid #FF0;
background: #033 ;
-moz-border-radius: 10px;
border-radius: 10px;
padding: 2px 6px;
color:#CF3;
margin: 2px;
}
.no_active //Свойство не активной ссылки.
{
border:1px #609 solid;
margin: 5px;
display:block;
padding: 2px 6px;
text-decoration: none;
background: #CF9 no-repeat;
-moz-border-radius: 10px;
border-radius: 10px;
}
Код Функции меню