Основной особенностью данного горизонтального меню для uCoz, является его полноценная функциональность, которая очень удобна, а вместе с тем и великолепно сочетается с внешним видом самого меню. Получается, что функциональное меню для ucoz сайтов будет не только удобно, а еще и красиво, что так же является большим плюсом!
1. В самый низ CSS:
Код
/*------------------------------------------*/ /*--------- Dark Menu Styles Begin ---------*/ /*------------------------------------------*/
/* Main Dark Menu Unordered List First Level Style */ ul.dark_menu { list-style: none; padding: 0; font-family: Arial; font-size: 14px; line-height: 14px; }
/* Transition Effect */ -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; }
/* List Items Links Hover State Style */ ul.dark_menu li a:hover { color: #73635e;
/* Transition Effect */ -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; }
/* List Items Links Active and Selected State Style */ ul.dark_menu li a.selected, ul.dark_menu li a:active { color: #73635e; background: #282321;
/* Transition Effect */ -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; }
/* Sub Menu Unordered List Second Level Style */ ul.dark_menu li ul { display: none; }
/* Before Second Level Unordered List Style */ ul.dark_menu li ul:before { content: " "; position: absolute; display: block; z-index: 1500; left: 0; top: -10px; height: 10px; width: 100%; }
/* Sub Menu Unordered List Second Level Style When Parent List Item is Hovered */ ul.dark_menu li:hover ul { position: absolute; display: block; z-index: 1000; left: 0; top: 44px; padding: 5px 0; list-style: none; background: #282321;
/* Second Level Menu List Items Style */ ul.dark_menu li ul li { float: none; margin: 0 10px; border-bottom: 1px solid #191614; border-top: 1px solid #3a3230; }
/* First List Item in Second Level Menu Style */ ul.dark_menu li ul li:first-child { margin: 0 10px; border-top: 0 none; }
/* Last List Item in Second Level Menu Style */ ul.dark_menu li ul li:last-child { border-bottom: 0 none; }
/* Second Level List Items Links Style */ ul.dark_menu li ul li a, ul.dark_menu li ul li a:link { color: #73635e; display: block; background: transparent none; padding: 10px 20px 10px 5px; white-space: nowrap;