Универсальное CSS3 меню одна кнопка замечательный пример CSS3 анимации
Автор: Admin Категория: Меню навигации Теги: Горизонтальное меню, Вертикальное меню, CSS3 Дата: 1-03-2011, 21:59
Стильная универсальная CSS3 навигация для сайтаЭто универсальное меню - замечательный пример CSS3 анимации. Раньше такого эффекта можно было добиться только с помощью скриптов, теперь это элементарно реализуется благодаря новым CSS3 свойствам.
В эту навигацию вошли такие CSS3 свойства как:
box-shadow - тень
border-radius - скругление углов
transition - CSS3 анимация (основа реализации навигации)
opacity - прозрачность
rgba - цвет + прозрачность одним свойством
Реализация этой навигации, на первый взгляд, может показаться сложной, но, на самом деле всё очень просто. Меню реализовано маркированным списком, в элемент списка вложен контейнер(DIV) с ещё одним маркированным списком, вот и вся HTML реализация, а вот CSS реализация немного сложнее, тут в двух словах не обьяснить, так что качайте пример, разбирайте, изучайте, подругому никак.
Код меню валидный DTD XHTML 1.0 Strict меню корректно работает только в новейших браузерах - Opera 11, последние Google Chrome или Safari, этими браузерами и нужно просматривать пример. Для прикола можно посмотреть пример меню браузером IE
Смотреть пример универсальное CSS3 меню одна кнопка замечательный пример CSS3 анимации
Скачать готовый пример универсальное CSS3 меню одна кнопка замечательный пример CSS3 анимации
Пользуемся на здоровье!
Не забываем комментировать и добавлять новость в закладки!
Понравилась новость Универсальное CSS3 меню одна кнопка замечательный пример CSS3 анимации на MegaWeb.su? Сохрани в закладках или распечатай!
Информация
Если копируете мой материал - будьте добры оставлять ссылку на источник MegaWeb.su пожалуйста, или поставьте на свой сайт мою кнопочку.
Уважайте чужой труд! И Вам хорошо - и мне приятно, это стимулирует дальнейшее развитие проекта!
Другие новости по теме
Обратите внимание, возможно Вас заинтересуют другие публикации, похожие на Универсальное CSS3 меню одна кнопка замечательный пример CSS3 анимации из категории Меню навигации
- Основы / Шаблоны ⋙ CSS3 книга с эффектом перелистывания страниц
- Меню навигации ⋙ Простое горизонтальное CSS3 слайдер меню
- Меню навигации ⋙ Круглое css3 меню звезда
- Меню навигации ⋙ Выезжающее CSS3 меню
- Меню навигации ⋙ Стильное фантастическое меню шапка на CSS3
- Меню навигации ⋙ Горизонтальное Lavalamp меню на CSS3
- Меню навигации ⋙ Горизонтальная раздвижная CSS3 навигация
- Меню навигации ⋙ Стильное горизонтальное меню навигации для сайта с применением CSS3 анимации
- Меню навигации ⋙ Одна кнопка вертикальное меню аккордеон CSS + javascript
- Основы / Шаблоны ⋙ Блок DIV с закруглёнными углами и тенью с помощью CSS3
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.
