Меню категорий для сайта на CSS3
 | |
| Вы можете сделать уникальное появление категорий вашего сайта на CSS3 и jQuery. Красивая анимация появление его, по клику кнопки на сайте. Что можно с точностью подчеркнуть, это уникально смотрится на любой тематике интернет ресурса. Вы можете выставить кнопку там где считаете нужным и написать, что это категорий или может разделы, возможно та информация, которую посчитаете нужным поставить. И после нажатие на весь монитор появится темно прозрачный фон и на нем кнопки, где пользователь может прочесть, куда ему перейти. Можно установить на многие порталы, так как кнопка вызова будет по дизайн, который вам нужен и здесь даже можно просто прописью написать. Это скажем, что к навигаций относиться на прямую, и здесь главное, чтоб все по теме выставить для того, чтоб было легче выйти на нужный вам материал. Здесь идут стили и как понимаете, что вы можете поменять цвет и вообще фигуры, вместо круглого сделать где то на 5 пикселей. И как видите, что есть эффект при наведение, что показано на изображение к этому материалу который вам представлен. Здесь представлена демонстрация, что можете визуально посмотреть и проверить как все работает. Переходим к установки: Скачиваем архив с нашего сайта и папку menu_css загружаем в свой Файловый Менеджер. Подключаем стили меню перед /hеаd Код <link rel="stylesheet" href="/menu_css/style.css"> <script src="/menu_css/modernizr.js"></script> Перед /body вставляете: Код <script src="/menu_css/main.js"></script> Кнопка вызова меню: Код <section class="cd-section"> <a class="cd-bouncy-nav-trigger" href="javascript://">Открыть меню сайта</a> </section> Само меню вставляете в нижнюю часть сайта: Код <div class="cd-bouncy-nav-modal"> <nav> <ul class="cd-bouncy-nav"> <li><a href="http://zornet.ru/">Навигация 1</a></li> <li><a href="http://zornet.ru/">Категория 2</a></li> <li><a href="http://zornet.ru/">Навигация 3</a></li> <li><a href="http://zornet.ru/">Навигация 4</a></li> <li><a href="http://zornet.ru/">Навигация 5</a></li> <li><a href="http://zornet.ru/">Категория 6</a></li> </ul> </nav> <a href="javascript://" class="cd-close">Закрыть меню</a> </div> PS - возможно сделать больше и вообще вывести самые главные как разделы или категорий, здесь уже вам больше виднее как задействовать. Источник: Webmaster-ucoz.ru | |
Поделиться в социальных сетях
Материал разместил
| Комментарии: 3 | |
|
| |
