Подборка горизонтальных меню на jQuery. CSS и jQuery панель навигации. Выезжающее сверху CSS меню

Навигация – это один из наиболее важных элементов веб-дизайна. Плохая навигация всегда будет выделяться среди хорошего контента. Хорошее навигационное меню должно быть эстетичным и удобным в использовании. Именно здесь нам на помощь приходят навигационные меню, разработанные при помощи jQuery и CSS3.

С теми свойствами и уровнем оформления, которые нам предоставляют jQuery и CSS3, мы без труда можем создать превосходную навигацию для веб-сайта. Конечно же, это может показаться немного сложным, если вы не знакомы с данными технологиями. К счастью, есть люди, которые уже написали весь нужный код за нас.

В нашей сегодняшней подборке мы собрали для вас 35 свежих (большинство было представлено в 2012 году), красивых и очень удобных навигационных меню на jQuery и CSS3. Все что от вас требуется, это лишь оформить их по собственному желанию!

Готовы ли вы познакомиться с представленными сегодня примерами? Давайте же приступим!

jMenu представляет собой jQuery-плагин, который позволяет нам создавать горизонтальное навигационное меню с неограниченным числом подпунктов. Кроме jQuery, он также требует наличия jQuery UI и поддерживает все эффекты данной библиотеки (вроде fadeIn или slideDown). Разметка меню очень проста за счет того, что в ней используются вложенные списки.

Ascensor – это jQuery-плагин, направленный на подстройку и адаптацию контента к системе элеватора.

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

HorizontalNav представляет собой jQuery-плагин, который растягивает горизонтальное навигационное меню по всей ширине контейнера. Если вам когда-либо приходилось делать подобный эффект, то вам должно быть известно, насколько это нудно. Данный плагин в значительной степени облегчает процесс, даже если вы работаете с адаптивным дизайном.

Простой jQuery-плагин для организации навигации с 2 возможными эффектами ‘fade’ и ‘slide’.

Цель данного плагина заключается в автоматической трансформации обычных ссылок в Ajax-запросы, предназначенные для мобильных браузеров, что предотвращает отображение адресной строки при произведении клика по ссылке. Это повышает удобство использования, позволяет использовать функции onload и onunload для каждой страницы, на которую производится переход.

Kwicks для jQuery изначально представлял собой нечто вроде невероятно привлекательного эффекта Mootools, но со временем перерос в очень гибко настраиваемый и универсальный виджет.

CasperJS представляет собой утилиту с открытым исходным кодом, предназначенную для создания и тестирования навигации. Она была написана на javascript, и основана на PhantomJS – невероятном движке WebKit. Она в значительной степени упрощает процесс создания полноценного навигационного меню, и предоставляет удобные функции на высоком уровне, а также методы и синтаксис для выполнения основных задач.

Bootstrap Image Gallery – это расширение для модальных окон в наборе инструментов для Twitter под названием Bootstrap, которое облегчает навигацию по коллекциям изображений в галерее. Здесь представлены функции управления посредством мыши и клавиатуры, эффекты при переходе, полноэкранный режим и функционал слайд-шоу.

Flipboard Layout – это экспериментальная разметка страницы, которая позволяет вам перелистывать страницы с имитацией реальной книги.

TinyNav.js – это миниатюрный jQuery-плагин (362 байта при gzip-сжатии), который конвертирует «ul» и «ol» навигации в выпадающие списки для маленьких экранов. Плагин также автоматически выбирает текущую страницу и добавляет параметр selected=”selected” к выделенному пункту.

stack.js – это презентационная библиотека с интуитивной прокручиваемой навигацией.

flexnav предлагает специальный подход к разработке навигаций для комплексных веб-сайтов.

Плагин jQuery Keyboard Navigation предоставляет возможность навигации по элементам на странице, реализующуюся за счет клавиш на клавиатуре.

Menutron – это jQuery-плагин для адаптивных навигационных меню.

jlNav представляет собой jQuery-плагин, который создает привлекательное небольшое навигационное меню на CSS из вложенных неупорядоченных списков.

17. Простая адаптивная навигация на jQuery - ресурс больше не существует

Очень маленькая и простая в использовании платформа, jQuery-плагин для адаптивной (и многоуровневой) навигации.

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

Filtrify – это плагин для расширенной фильтрации тэгов, разработанный под вдохновением от Chosen и вертикального меню навигации от Ормана Кларка. Расширенный он потому, что вы можете осуществлять поиск тэгов внутри тэгов и фильтровать пункты по нескольким тэгам с разных категорий.

Curtain.js превращает ваш веб-сайт в анимированный прокручиваемый шедевр.

PageSlide – это jQuery-плагин, который прокручивает веб-страницу для того, чтобы предоставить пользователю дополнительную интерактивную панель.

Smooth Div Scroll – это простенький jQuery-плагин, который позволяет нам прокручивать контент в горизонтальном направлении.

Простенькое навигационное меню на HTML5/CSS3.

Данное адаптивное меню на CSS использует media queries для того, чтобы предоставить нам гибкий адаптивный дизайн, который без труда адаптируется под любой размер окна просмотра. Здесь представлены три цветовые вариации, каждая из которых оформлена анимированным стилем при наведении.

Pro CSS Menu – это универсальное CSS-меню, готовое к использованию в любом собственном дизайне. Вы без труда сможете оформить меню под собственные нужды, так как оно предлагается в нескольких цветовых схемах.

Bold CSS3 Navigation – это современное навигационное меню с красивой типографикой и отличной комбинацией цветов. Здесь представлены 2 версии (горизонтальная и вертикальная) и 8 цветовых схем, которые точно выделят ваши страницы среди других. Меню очень простенькое и им невероятно просто воспользоваться благодаря семантической разметке.

Modern Vertical Menu представляет собой опрятное меню навигации, предлагаемое в двух цветовых схемах. Оно предлагает вам функции создания выпадающих меню, и использует плавные эффекты отображения.

Modern Menu было оформлено и разработано специально с учетом современных тенденций. Оно очень гибкое и простое в использовании и оформлении. Данный вариант отлично подойдет для создания динамического меню на вашем сайте.

Metro – это CSS3-меню, разработанное под вдохновением от пользовательского интерфейса Microsoft Metro. Оно представлено в 4 различных «блочных» разметках, 5 вариантах анимации и многими привлекательными свойствами. Им очень просто воспользоваться и установить его. Вместе с меню представлена хорошая документация и разработано оно было без использования JS/jQuery.

jPList – это гибкий jQuery-плагин для сортировки, создания пагинации и фильтрации любой HTML-структуры (DIVs, UL/LI, таблицы и т.д.).

Mega Menu Reloaded представляется с невероятными опциями, и его можно назвать наиболее полноценным решением для создания мега-меню навигации. Оно так же работает без JS, но при этом большинство контента остается доступным, если поддержка JS будет отключена. Опциональные свойства вроде формы контактов или вкладок можно изменять и убирать по собственному усмотрению.

В данном руководстве вы сможете найти информацию о том, как создать привлекательное меню с анимированным контентом посредством jQuery для шаблона веб-сайта ресторанного бизнеса. Пункты меню будут анимированы, и при произведении клика будет появляться дополнительная область с информацией. Фоновое изображение так же будет изменяться в зависимости от выбранного пункта меню.

Быстрое руководство, в котором вам покажут, как можно приукрасить меню с помощью CSS3: добавить изображение к каждому пункту меню и раскрывать его при наведении курсора.

4. Создаем темное меню навигации с псевдо-элементами - Ресурс умер

Изучаем процесс разработки темного меню навигации на основе PSD. Навигация по сайту, это важный аспект любого функционального макета. Пользователи часто будут искать методы для перемещения по вашим страницам, а иногда это требует немного творчества. Мне нравится идея вертикальных навигаций, особенно подменю.

В этом уроке я продемонстрирую, как мы можем создать простое меню навигации по вертикали, используя методы CSS3 и jQuery. Мы можем создавать пользовательские стили и форматировать ссылки для перехода вниз и вверх по каждому клику. Используя этот метод, мы также можем создавать ссылки подменю, разделяя заголовки по идентификаторам или именам классов. Следуйте приведенным ниже идеям и не стесняйтесь загружать копию моего исходного кода.

Меню автоматически откроется и выделит элемент подменю, который содержит текущую ссылку на страницу при открытии страницы, что облегчит пользователям поиск и переход к другим элементам подменю. В этом руководстве используются jQuery и CSS для создания гармонического меню, которое является интерактивным и анимированные. Когда вы нажимаете элемент меню, элементы подменю плавно скользят вниз, чтобы выявить себя. Повторно щелкните элемент меню, и слайд вернется и исчезнет. Этот фрагмент будет отличным дополнением к любому проекту.

​JavaScript

/*jQuery time*/
$(document).ready(function(){
$("#accordian h3").click(function(){
//slide up all the link lists
$("#accordian ul ul").slideUp();
//slide down the link list below the h3 clicked - only if its closed
if(!$(this).next().is(":visible"))
{
$(this).next().slideDown();
}
})
})

CSS

/*Basic reset*/
* {margin: 0; padding: 0;}

Body {
background: #4EB889;
font-family: Nunito, arial, verdana;
}
#accordian {
background: #004050;
width: 250px;
margin: 100px auto 0 auto;
color: white;
/*Some cool shadow and glow effect*/
box-shadow:
0 5px 15px 1px rgba(0, 0, 0, 0.6),
0 0 200px 1px rgba(255, 255, 255, 0.5);
}
/*heading styles*/
#accordian h3 {
font-size: 12px;
line-height: 34px;
padding: 0 10px;
cursor: pointer;
/*fallback for browsers not supporting gradients*/
background: #003040;
background: linear-gradient(#003040, #002535);
}
/*heading hover effect*/
#accordian h3:hover {
text-shadow: 0 0 1px rgba(255, 255, 255, 0.7);
}
/*iconfont styles*/
#accordian h3 span {
font-size: 16px;
margin-right: 10px;
}
/*list items*/
#accordian li {
list-style-type: none;
}
/*links*/
#accordian ul ul li a {
color: white;
text-decoration: none;
font-size: 11px;
line-height: 27px;
display: block;
padding: 0 15px;
/*transition for smooth hover animation*/
transition: all 0.15s;
}
/*hover effect on links*/
#accordian ul ul li a:hover {
background: #003545;
border-left: 5px solid lightgreen;
}
/*Lets hide the non active LIs by default*/
#accordian ul ul {
display: none;
}
#accordian li.active ul {
display: block;
}

Иногда вы просто не можете поместить горизонтальную навигацию в подходящее место. Однако вы можете легко реализовать этот код в боковой панели или плавать рядом с содержимым страницы.

Мы собрали подборку свежих, красивых и удобных горизонтальных меню для сайта, созданных с помощью CSS3 и jQuery . Все что вам нужно сделать, это просто оформить их под собственные требования.

Выбор редакции: Mega Menu Reloaded

Mega Menu Reloaded предлагает множество опций для создания комплексных современных меню навигации. Плагин работает без использования Javascript , и даже при отключении поддержки этой технологии меню будет отлично смотреться практически в любом браузере. За сравнительно небольшие вы получите функциональное меню навигации без необходимости связываться с написанием кода:

Полноценное решение для создания отличных меню навигации

1. jMenu

jQuery-плагин , который позволяет создавать красивое горизонтальное меню для сайта с неограниченным количеством подменю. Кроме самой библиотеки jQuery вам также потребуется использовать jQuery UI . Но при этом плагин поддерживает все эффекты, доступные в этой библиотеке (например, fadeIn или slideDown ). Разметка меню опрятная, так как здесь используются вложенные списки.

2. Ascensor

jQuery-плагин для создания меню со специальной системой размещения контента на странице.

3. jQuery Dropdown Login Form

4. HorizontalNav

HorizontalNav представляет собой jQuery-плагин для создания горизонтального резинового меню для сайта , которое растягивается на всю ширину экрана или контейнера. Если вам приходилось создавать подобный эффект, то вы наверняка знаете, насколько это трудно. Плагин значительно облегчает эту задачу, даже если вы используете адаптивный дизайн.

5. jQuery Navigation Plugin

Простой плагин навигации с двумя возможными эффектами: ‘fade ’ и ‘slide ’.

6. Automatic Ajax jQuery Navigation

Задача jQuery-плагина Ajax-Navigation заключается в автоматической трансформации обычных ссылок в Ajax-запросы для мобильных браузеров и отключении отображения адресной строки при нажатии по ссылкам. Это позволяет улучшить опыт взаимодействия с пользователем. Также плагин предлагает функции onLoad и onUnload для каждой страницы, за счет чего можно добиться привлекательных эффектов при их открытии.

7. Kwicks Extended Navigation

Kwicks для jQuery начинал свою историю как часть популярного набора эффектов Mootools , но перерос в отдельный универсальный виджет.

8. CasperJS

Утилита для создания и тестирования многоуровневого горизонтального меню для сайта с открытым исходным кодом, написанная на JavaScript и основанная на PhantomJS . Она значительно облегчает процесс разработки меню, а также предлагает продвинутые функции и методы.

9. Bootstrap Image Gallery

Расширение для модального окна из набора инструментов Bootstrap от Twitter , которое позволяет использовать для навигации мышь и клавиатуру. А также включать эффекты перехода, активировать полноэкранный режим, а также запускать слайд-шоу.

10. Flipboard Layout

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

11. TinyNav

Миниатюрный jQuery-плагин , который позволяет конвертировать элементы

и
в выпадающие списки для маленьких экранов. Он также автоматически выделяет текущую страницу и добавляет selected=”selected” для выделенного элемента.

12. stack.js




Библиотека для презентаций с интуитивной навигацией на базе скроллинга.

13. flexnav




Предоставляет возможность для реализации горизонтального меню с подменю для сайта без привязки к конкретным устройствам.

14. jQuery Keyboard Navigation Plugin




Плагин создает меню, с помощью которого можно переходить по элементам на странице, используя стрелки на клавиатуре.

15. Menutron




jQuery-плагин для создания адаптивных навигационных меню.

16. jlnav




Представляет собой jQuery-плагин , который позволяет создавать оригинальное горизонтальное меню для сайта на CSS из вложенных неупорядоченных списков.

17. Simple Responsive jQuery Navigation




Миниатюрный и простой в использовании фреймворк и jQuery-плагин для создания адаптивных (многоуровневых ) навигационных меню.

18. Scrollpath




Плагин для установки пользователем направления прокрутки. Здесь для прорисовки линий и арок используется синтаксис на основе canvas .

19. filtrify




Продвинутым этот плагин считается потому, что позволяет осуществлять поиск по нескольким критериям одновременно в различных категориях сайт. А также просматривать количество записей, включающих указанные теги в режиме реального времени.

20. Curtain.js




Способен превратить ваш сайт в анимированное произведение искусства.

21. PageSlide




jQuery-плагин , который позволяет прокручивать веб-страницу, чтобы открыть дополнительную секцию управления.

22. Smooth Div Scroll




Простой jQuery-плагин , который позволяет прокручивать контент влево или вправо.

23. HTML5/CSS3 Gray Navigation Menu




Простенькое горизонтальное меню для сайта на HTML5 и CSS3 .

24. Responsive CSS Navigation Menu




Это адаптивное меню навигации на CSS3 использует медиа-запросы для достижения гибкости и отзывчивости дизайна. Шаблон способен подстраиваться под экраны любых размеров. Плагин включает в себя три цветовые вариации, в каждой из которых представлены эффекты при наведении курсора.

25. Pro CSS Menu




Универсальное CSS-меню , которое можно сразу использовать в собственных дизайнах. Оно представлено в нескольких цветовых схемах, а также предлагает возможность настройки при помощи CSS .

26. Bold CSS3 Navigation (платно – $4)




Современное горизонтальное резиновое меню для сайта с красивыми шрифтами и продуманной цветовой комбинацией. Оно доступно в двух версиях (горизонтальной и вертикальной ) и 8 цветовых схемах. Благодаря семантической разметке меню очень просто пользоваться.

27. Modern Vertical Menu (платно – $2)




Опрятное и красивое навигационное меню, представленное в двух цветовых схемах. Оно позволяет реализовать выпадающие списки, а также использовать плавные эффекты.

На котором можно создавать файлы примеров для использования их в проектах. В данной статье мы рассмотрим примеры различных меню, авторы которых разместили свой код на codepen.io.

Простые меню вы можете разобрать с помощью . Здесь же будут рассмотрены примеры различных меню, появляющихся по клику на кнопке. В этих меню, помимо css-форматирования, используется код на JavaScript/jQuery.

Flexbox-меню с перекрытием экрана

Верстка меню основана на модели Flexbox. При появлении элементов меню происходит перекрытие экрана. Используются и анимация с помощью свойства transition . Также используется код на jQuery.

Меню со слайд-эффектом

При клике на элементах этого меню используется плавный переход подчеркивания для активной ссылки. Здесь есть не только css-форматирование, но и код на jQuery.

В примере используются html-, css- и js-препроцессоры. Если код вам непонятен, нажмите на стрелку в правом верхнем углу соответствующей вкладки и выберите пункт "View compiled HTML" и т.п. при редактировании этого примера на Codepen .

Цветное навигационное меню на основе CSS и jQuery

В этом css-меню используется эффект изменения цвета активной точки при наведении на один из пунктов. Как и в предыдущих меню, без jQuery здесь не обошлось.

Скошенное меню

В этом меню внешний вид обеспечивается с помощью CSS3-свойства transform: skew() . Очень интересный вид, полученный путем списка ссылок.


CSS меню с эффектами при прокручивании и наведении

В этом меню использованы эффекты при прокручивании (скроллинге), связанные с 3d-трансформациями и увеличении масштаба при наведении. Также не обошлось без JavaScript.

Интересное меню с различными цветами и иконками для пунктов меню. Оно предполагает разворачивание на весь экран.

Меню для мобильной версии сайта или приложения

Это меню "заточено" под мобильную версию сайта или мобильное приложение. Используется не только css-форматирование, но и JavaScript-код.

Анимационное меню с SVG (UI Navigation Concept)

Меню, предназначенное опять-таки либо для мобильной версии сайта, либо для мобильного приложения. В нем используются анимации SVG и CSS3 без подключения сторонних библиотек + код на JavaScript.

Желеобразное меню для мобильных устройств

Очень интересное меню с приятной анимацией при скроллинге и прикосновении на мобильных устройствах. Требует подключения множества библиотек.

Боковое css-меню c иконкой-гамбургером

Приятное боковое выезжающее меню с CSS-анимацией появления самого меню и изменения иконки-гамбургера. Подойдет как для основной версии сайта, так и для мобильной. Помимо CSS, используется код на jQuery.

Боковая панель с меню

Меню расположено на боковой выезжающей панели справа. При появлении меню основной контент сдвигается влево. Использован код на JS.

Выезжающее сверху CSS меню

При нажатии на кнопку-гамбургер сверху с анимацией появляется меню. Контент смещается вниз с отступами слева и справа. Помимо css-transition использован несложный код на jQuery.

See the Pen Off canvas menu by Mark Murray (

В настоящее время jQuery меню навигации это больше, чем просто блоки текста со ссылками в них. В я рассказал, как с помощью JQuery и CSS3 вы можете создать меню навигации, которое будет выглядеть очень круто.

С помощью возможностей JQuery мы можем превратить меню навигации в динамическое меню. Хотя сейчас для создания динамической навигации можно использовать только CSS3 , JQuery делает меню еще более функциональным.

Помимо динамических функций, дизайн также играет немаловажную роль. Хотя бы потому, что это то, что посетители видят в первую очередь, когда заходят на ваш сайт.

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

Сегодня я представляю вам 30 отличных примеров JQuery меню навигации.

1. Pushy

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

Демо | Скачать

2. Slinky




Это еще одно отличное JQuery -меню для создания красивых прокручиваемых списков навигации. Его отличительной чертой является малый размер исходных файлов.

Демо | Скачать

3. jQuery Pop Menu




Это простое адаптивное всплывающее меню с очень интересными функциями. При нажатии на иконку меню, всплывает окно меню с иконками элементов. Посмотрите демо.

Демо | Скачать

4. Slidebars




Slidebars — JQuery фреймворк для быстрой и простой реализации стилей приложения без привязки к холсту. Slidebars также обрабатывает изменения ориентации и изменение размеров.

Демо | Скачать

5. jQuery Square Menu




JQuery меню, которое выводит квадратное анимированное меню сайта с помощью JQuery и CSS3 . Убедитесь в этом, посмотрев демо.

Демо | Скачать

6. Perspective Page View Navigation




Это jQuery меню навигации превращает страницу в 3D меню. Идея заключается в том, чтобы создать дизайн мобильного приложения, в котором при клике по иконке меню, содержимое страницы сдвигается в сторону, а меню выводится на передний план.

Демо | Скачать

7. SlickNav




Плагин для создания адаптивного мобильного jQuery меню с несколькими уровнями и гибкой, но простой настройкой. Совместим с разными браузерами, возможна навигация с помощью клавиатуры.

Демо | Скачать

8. Mmenu




jQuery меню для приложений с привязкой и без привязки к холсту с всплывающими подпунктами. Благодаря многочисленным опциях, адд-онам и расширениям, возможна очень гибкая настройка меню.

Демо | Скачать

9. Sidr




jQuery плагин для создания меню и простого добавления адаптивных функций. С помощью Sidr вы сможете создавать различные элементы своего сайта, а также адаптивные меню.

Демо | Скачать

10. slimMenu




slimMenu — это небольшой jQuery плагин, который поможет вам в разработке адаптивных, многоуровневых меню навигации. Что самое классное в нем, так это то, что вы можете иметь несколько разных меню, и все они будут абсолютно адаптивны.

Демо | Скачать

11. HorizontalNav




jQuery меню навигации, позволяющее задать горизонтальное меню по всей ширине контейнера. С помощью этого плагина это делается очень просто. Кроме того можно реализовать поддержку для IE7 .

Демо | Скачать

12. FlexNav




Это mobile-first пример использования медиа запросов и JavaScript для создания отличного многоуровневого меню с поддержкой сенсорных экранов, эффектов наведения и навигации с помощью клавиатуры.

Демо | Скачать

13. jQuery Menu-Aim




jQuery меню, которое запускает события при наведении курсора мыши на выпадающий элемент меню. Идеально подходит для создания адаптивных выпадающих меню, как на Amazon .

Демо | Скачать

14. SmartMenus




Плагин jQuery меню, который предлагает простой и интуитивный способ вывода меню. Создает адаптивные списки меню. Работает на всех устройствах!

Демо | Скачать

15. Shifter




Shifter — простой в использовании mobile-first jQuery плагин для создания слайд-меню, выезжающих с правой стороны при нажатии на кнопку переключения. Для настройки существует только одна опция maxWidth . Она позволяет настроить разрешение/ориентацию для мобильных устройств.

Демо | Скачать

16. Hamburger




Hamburger — это jQuery плагин для создания слайд-меню в стиле Android App , в котором по правому краю экрана размещается всплывающее меню. При раскрытии меню в полном размере, оно перекрывает область контента, но не панель действий.

Демо | Скачать

17. Focucss




Focucss — jQuery меню навигации, с помощью которого создается не привязанное к холсту меню в сайдбаре с крутыми функциями размытости, с помощью которых вы можете обратить внимание пользователей на основные разделы сайта и сделать менее заметными не слишком полезные разделы.

Демо | Скачать

18. Drawer




Drawer — jQuery плагин для создания адаптивного, анимированного меню, выезжающего при нажатии из боковой области экрана. Подобные функции вы могли видеть в Android -приложениях.

Демо | Скачать

19. Datmenu




Datmenu — премиум jQuery адаптивное меню с различными функциями CSS3 анимации. Что самое замечательное в этом плагине, так это возможность полной настройки с помощью js -опций.

Демо | Скачать

20. jPanelMenu




jPanelMenu — красивое и современное jQuery меню, позволяющее создавать панельное меню навигации с функциями переходов CSS3 анимации. Стиль jPanelMenu напоминает мобильные версии Facebook и Google . Плагин может использоваться для разнообразных мобильных приложений.

Демо | Скачать

21. Fly Side Menu




Fly Side Menu — крутой плагин меню навигации, который использует CSS3 для создания бокового меню с 3D преобразованиями и переходами.

Демо | Скачать

22. PageScroll jQuery Menu Plugin




PageScroll — настраиваемое мобильное jQuery -меню, рекомендованное для использования на любых веб-сайтах, а также целевых страницах.

Демо | Скачать

23. DD Icon Menu




DD Icon Menu — это jQuery плагин, который позволяет создавать вертикальное меню иконок, расположенное на краю экрана с разворачивающимися при наведении подпунктами меню.

Демо | Скачать

24. JQuery Mobile Date Navigation




jQuery меню, позволяющее осуществлять навигацию по датам в выбранном диапазоне (неделя, месяц или год ). Идеально для запросов информации с помощью вызовов AJAX .

Демо | Скачать

25. Navobile




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

Демо | Скачать

26. Multi-Level Push Menu




Multi-Level Push Menu — это Javascript библиотека, созданная MARY LOU из Codrops . Она создает многоуровневые меню, выезжающие с левой стороны экрана и сдвигающие контент вправо.

Демо | Скачать