регистрация
856материалов
3341комментарий
239тем на форуме
7060пользователей

Разноцветное горизонтальное анимированное меню на jQuery для uCoz


Простое симпатичное разноцветное меню со скользящим эффектом при наведении на пункты. Замечательно подойдёт для развлекательных сайтов

Примечание:
Для правильной работы скрипта нужна версия jQuery не ниже 1.7.2

УСТАНОВКА:

Шаг 1.

После < /head > на нужных страницах вставляйте:
Код
<script src="http://webo4ka.ru/Ucoz8/init.js"></script>   
<script src="http://webo4ka.ru/Ucoz8/easing.js"></script>

Шаг 2.
Далее идём в ПУ => Управление дизайном => таблицы стилей CSS, и вставляем в самый низ этот код:
Код
#menu {   
float: left;   
position: relative;   
top: 0;   
left: 0;   
margin:0px;   
overflow: hidden;   
}   
#menu .colourful {   
display: block;   
position: absolute;   
background: #f0ad22;   
height: 38px;   
width: 85px;   
top: 4px;   
left: -100px;   
}   
#menu ul {   
margin: 0;   
padding: 0;   
list-style: none;   
float: left;   
position: relative;   
top: 0;   
left: 0;   
z-index: 1;   
}   
#menu li {   
float: left;   
margin: 0 1px 0 0;   
}   
#menu a:link, #menu a:visited, #menu a:hover, #menu a:active {   
color: #000;   
text-align: center;   
display: block;   
border: solid;   
border-width: 4px 0 0;   
line-height: 40px;   
width: 85px;   
}   
#menu li a:hover {   
text-decoration: none;   
color: #fff;   
text-shadow: 0 0 1px #999;   
}

Шаг 3.
Этот код вставляйте в то место, где хотите видеть ваше меню:
Код
<div id="menu">   
<ul>   
<li> <a href="">Веб-дизайн</a>   

</li>   
<li> <a href="">jQuery</a>   

</li>   
<li> <a href="">Html5 и Css3</a>   

</li>   
<li> <a href="">PHP</a>   

</li>   
<li> <a href="">Photoshop</a>   

</li>   
<li> <a href="">Illustrator</a>   

</li>   
<li> <a href="">Wordpress</a>   

</li>   
<li> <a href="">Статьи</a>   

</li>   
<li> <a href="">vBulletin</a>   

</li>   
</ul>   
</div>   
<!-- end menu -->

Готово, пользуйтесь 


Скрипт опубликовал:
...
Логин на сайте: ...
Группа: ...
Статус: ...
Информация о скрипте:
Дата добавления материала: 04.02.2014 в 15:23
Материал просмотрен: 1219 раз
Категория материала: Скрипты для uCoz
К материалу оставлено: 0 комментариев

Пожаловаться
Сказать спасибо
Источник

0 комментариев


avatar
-50% на шаблоны от TemplateMonster
Создать сайт вместе с uKit.com
Статистики нашего сайта
Правила чата
Пользователи онлайн
Закрыть мини-чат
+Открыть мини-чат
0
Онлайн всего: 3
Гостей: 3
Пользователей: 0