Красивое меню с помощью CSS3 и jQuery - Сайт вебмастера
Меню сайта
Для Веб-Мастера Скрипты для сайта Онлайн игры Видео онлайн Картинки Заказать рекламу О нашем сайте Правила нашего сайта Обратная связь Карта сайта XML
Реклама
Наш опрос
Папка это?
Всего ответов: 1108
Статистика


Онлайн всего: 3
Гостей: 2
Пользователей: 1

Гости Пользователи
Дополнительно
Главная » Скрипты для сайта » Меню для сайта

Красивое меню с помощью CSS3 и jQuery

Хочешь сказать спасибо? Кликни на рекламный баннер.

25.03.2012, 19:00
Красивое меню для Вашего сайта с множеством цветовых схем.
Следующий отрывок кода используется для стилизации меню, его вставляете в CSS :
Code
.lavalamp {
position: relative;
border: 1px solid #d6d6d6;
background: #fff;
padding: 15px;
-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);
-moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);
border-radius : 10px;
-moz-border-radius : 10px;
-webkit-border-radius : 10px;
background : -webkit-gradient(linear, left top, left bottom, from(rgb(240,240,240)), to(rgb(204,204,204)));
background : -moz-linear-gradient(top, rgb(240,240,240), rgb(204,204,204));
height: 18px;
}

ul {
margin: 0;
padding: 0;
z-index: 300;
position: absolute;
}

ul li {
list-style: none;
float:left;
text-align: center;
}

ul li a {
padding: 0 20px;
text-align: center;
}

.floatr {
position: absolute;
top: 10px;
z-index: 50;
width: 70px;
height: 30px;
border-radius : 8px;
-moz-border-radius : 8px;
-webkit-border-radius : 8px;
background : rgba(0,0,0,.20);
-webkit-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
}

HTML разметка:
Code
<div class="lavalamp" >
  <ul>
  <li class="active"><a href="/">Главная</a></li>
  <li><a href="/">Скрипты</a></li>
  <li><a href="/">Блог</a></li>
  <li><a href="/">Форум</a></li>
  <li><a href="/">Статьи</a></li>
  <li><a href="/">Картинки</a></li>
  <li><a href="/">Портфолио</a></li>
  <li><a href="/">Контакты</a></li>
  <li><a href="/">Поиск</a></li>
  </ul>
  <div class="floatr"></div>
  </div>

Заливаем в корень сайта три папки с их содержимым: images, js, styles.





Если у Вас возникли вопросы по установке или работе скрипта, то задайте их в комментариях и мы постараемся вам помочь.

Источник материала: Неизвестен/Не указан
При коприровании материала просьба ставить ссылку на оригинальную статью.

Ссылка:
BB-код:
HTML-код:
Добавил: -angel- | Просмотров: 5118 | Загрузок: 557 | Комментарии: 3 | Рейтинг: 4.4/7
Теги: меню для ucoz, красивое меню с помощью CSS3 и jQue, скрипт, меню с помощью CSS3
Всего комментариев: 2
Сообщение №1 от Olga
Добавлен: 31.10.2013

//Заливаем в корень сайта - это как?
Сообщение №2 от Олег
Добавлен: 31.10.2013

Это в Файловый менеджер
ВНИМАНИЕ !!!
Добавлять комментарии могут только зарегестрированные пользователи!
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
А знаете ли Вы, что ...

Каждый раз облизывая почтовую марку, вы приобретаете 1/10 калорий.


Реклама
Популярные материалы
Наша кнопка
Мы будем вам признательны, если вы разместите нашу кнопку у себя на сайте:

Скрипты для сайта

Друзья сайта