НАМ 10 ЛЕТ
беЛн.бу
- Белорусский, народный портал






Реклама

Купить ссылку здесь за руб.
Поставить к себе на сайт

Реклама



Вход на портал

Для просмотра профиля, войдите на портал как пользователь.

Меню портала

Погода

GISMETEO: Погода по г.Минск
Погода в других городах

Категории раздела

Скрипты для uCoz [32]Шаблоны для uCoz [2]
Видео уроки по ucoz [0]Иконки для ucoz [0]
Кнопки для ucoz [2]Php скрипты для ucoz [0]

Полезные ссылки

Статистика портала

соц.сети

Облако тегов

Мы принимаем



ТОП РЕЙТИНГ

Скрипты (CMS) и Программы (SOFT)

Скрипты (CMS) и Программы (SOFT) » Для UCOZ » Скрипты для uCoz

Анимированное меню в виде ленты uCoz

Очень удобное меню, которое можно преподнести пользователям вашего сайта. Очень хорошо будет смотреться как на светлом, так и на темном дизайне. Само меню выполнено в простых стилях и оттенках. Благодаря этому меню не будет нагружать сайт множеством строк лишнего кода. Конечно, это вовсе не скрипт, но предложенный пользователям материал нам приглянулся, и мы хотели бы им с вами поделиться.

Выглядит данное меню в виде ленты, при наведении на пункты которого будет происходить плавная анимация, которая предаст меню еще более привлекательный вид.

Что ж давайте приступим к его установке. В то место, где хотим видеть меню, вставляем:

<div class='ribbon'>  
<a href='#'><span>Главная</span></a>  
<a href='#'><span>О нас</span></a>  
<a href='#'><span>Сервисы</span></a>  
<a href='#'><span>Контакты</span></a>  
</div>

Чтобы придать ему естественный вид, вставим в CSS следующий код:

.ribbon {  
display:inline-block;  
}  

.ribbon:after, .ribbon:before {  
margin-top:0.5em;  
content: "";  
float:left;  
border:1.5em solid #fff;  
}  

.ribbon:after {  
border-right-color:transparent;  
}  

.ribbon:before {  
border-left-color:transparent;  
}  

.ribbon a:link, .ribbon a:visited {
color:#000;  
text-decoration:none;  
float:left;  
height:3.5em;  
overflow:hidden;  
}  

.ribbon span {  
background:#fff;  
display:inline-block;  
line-height:3em;  
padding:0 1em;  
margin-top:0.5em;  
position:relative;  

-webkit-transition: background-color 0.2s, margin-top 0.2s; /* Saf3.2+, Chrome */  
-moz-transition: background-color 0.2s, margin-top 0.2s; /* FF4+ */  
-ms-transition: background-color 0.2s, margin-top 0.2s; /* IE10 */  
-o-transition: background-color 0.2s, margin-top 0.2s; /* Opera 10.5+ */  
transition: background-color 0.2s, margin-top 0.2s;  
}  

.ribbon a:hover span {  
background:#FFD204;  
margin-top:0;  
}  

.ribbon span:before {  
content: "";  
position:absolute;  
top:3em;  
left:0;  
border-right:0.5em solid #9B8651;  
border-bottom:0.5em solid #fff;  
}  

.ribbon span:after {  
content: "";  
position:absolute;  
top:3em;  
right:0;  
border-left:0.5em solid #9B8651;  
border-bottom:0.5em solid #fff;  
}

 

Пишите комментарии и оставляйте свое мнение, оно для нас очень важно.



Внимание!!! Скачивание файла доступно, только для групп "Пользователи", "VIP" и "Я, Online".
Категория: Скрипты для uCoz | Добавил: rinhed (06.10.2015)
Просмотров: 68 | Теги: Ленты, uCoz, анимированное, скрипты для Ucoz, меню, виде
Всего комментариев: 0
Имя *:
Email:
Код *:
Внимание! В комментариях запрещено размещать ссылки на сторонние ресурсы(сайты). Если Вы разместили ссылку, то комментарий будет удален автоматически.

Реклама

Корзина

Ваша корзина пуста

Переводчик

Выберите язык портала

Поиск по порталу

Поиск от яндекс

Анекдоты...

[30.12.2016][Разные]

Смотрел вакансии в поисках новой работы. Наткнулся на "Руководитель ритуального салона". И всё бы ничего, профессии разные бывают, но вот в круг его обязанностей там входит "расширение клиентской базы".

(0)

Видео

00:04:15

7Б - Птица RMX

  • Просмотры:
  • Всего комментариев: 0
  • Рейтинг: 0.0
00:03:44

ПРЕМЬЕРА ПЕСНИ!!! Никита Киселев - Подружка

  • Просмотры:
  • Всего комментариев: 0
  • Рейтинг: 0.0
00:03:34

Milk N Cooks - Joy District

  • Просмотры:
  • Всего комментариев: 0
  • Рейтинг: 0.0
00:03:54

ПРЕМЬЕРА ПЕСНИ!!! SOVETNIKOV - Давай

  • Просмотры:
  • Всего комментариев: 0
  • Рейтинг: 0.0
00:03:56

Группа Стрелки - Адреналин

  • Просмотры:
  • Всего комментариев: 0
  • Рейтинг: 0.0

Получить бонус

Еще бонусы тут

Моментальный обмен WebMoney

Вы можете получить WMR-бонус в размере 0,01-0,10 WMR на свой кошелек 1 раз в сутки

Кошелек
Код Защитный код

Обмен Webmoney

Бонус

BAKSGRAD.RU
Обновить Код.