Простое раздвижное меню для uCoz


Преимущество в том что легко работает и загружается

Установка:

В CSS в самый низ вставляем этот код:
Code
.menu2 {height:30px;width: 270px;text-align: left; margin-top:1px;}  
.menu2 a:link, .menu2 a:visited {color:#000000;padding-left:20px;line-height:30px;display:block;font-weight:normal;background: #FFFFFF ;border-top: 1px solid #212121;border-right: 1px solid #212121;border-left: 1px solid #212121 ;border-bottom: 1px solid #212121;text-align: left; margin-top:1px;}  
.menu2 a:hover {color:#ffffff;text-shadow:0 0 5px ;padding-left:20px;line-height:30px;display:block;font-weight:normal;background: #212121 ;text-align: left; margin-top:1px;}


Это вставляем там где хотим видеть меню
Code
<span class="menu2"><a onclick="$('#menu2').slideToggle(400);" href="javascript://"><b>Категория 1</b></a></span>  
<div id="menu2" style="display:none"><span class="menu">  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
</span></div>  

<span class="menu2"><a onclick="$('#menu3').slideToggle(400);" href="javascript://"><b>Категория 2</b></a></span>  
<div id="menu3" style="display:none"><span class="menu">  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
</span></div>  

<span class="menu2"><a onclick="$('#menu4').slideToggle(400);" href="javascript://"><b>Категория 3</b></a></span>  
<div id="menu4" style="display:none"><span class="menu">  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
</span></div>  

<span class="menu2"><a onclick="$('#menu5').slideToggle(400);" href="javascript://"><b>Категория 4</b></a></span>  
<div id="menu5" style="display:none"><span class="menu">  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
</span></div>  

<span class="menu2"><a onclick="$('#menu6').slideToggle(400);" href="javascript://"><b>Категория 5</b></a></span>  
<div id="menu6" style="display:none"><span class="menu">  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
</span></div>  

<span class="menu2"><a onclick="$('#menu7').slideToggle(400);" href="javascript://"><b>Категория 6</b></a></span>  
<div id="menu7" style="display:none"><span class="menu" align="left">  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
</span></div>  

<span class="menu2"><a onclick="$('#menu8').slideToggle(400);" href="javascript://"><b>Категория 7</b></a></span>  
<div id="menu8" style="display:none"><span class="menu">  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
<li><a href="/" title="">Ссылка</a></li>  
</span></div>



  Категория: Меню для ucoz | Добавил: AID | Дата: 13.10.2011

Другие новости


Поделиться ссылкой


Ссылка:
BB-code:
HTML:
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Хостинг от uCoz