Shop Scripts

Классический вариант горизонтального выпадающего меню на голом CSS и HTML по структуре из комбинаций тегов UL и LI, который встречается на большинстве сайтов, в том числе и WordPress.
Приведенный пример реализует двухуровневое выпадающее меню, то есть когда из горизонтального блока выпадает вертикальный. Если же вам нужно трехуровневое меню, когда из выпавшего вертикального меню необходимо появление еще одного подменю, то предложенное решение необходимо доработать. Меню содержит минимум оформления и требует доработки под дизайн сайта, где оно будет внедряться.

ДЕМО

СКАЧАТЬ

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

ДЕМО

СКАЧАТЬ

ДЕМО

СКАЧАТЬ

Скользящий эффект для меню при наведении, который более известен, как lavalamp эффект. Эффект реализован только на CSS с помощью transitions и селектора ~.

ДЕМО

СКАЧАТЬ

Для реализации такого стильного эффекта используется CSS3 свойство transition.
Шапка меню выполнено маркированным списком с разным уровнем вложенности. 

ДЕМО

СКАЧАТЬ

Древняя горизонтальная менюшка, свёрстана маркированным списком, выпадение реализовано на jаvascript.
Выпадает при клике по категории, закрывается так же при клике.   

ДЕМО

СКАЧАТЬ

Простое меню на jаvascript, вставить можно куда угодно. 

ДЕМО

СКАЧАТЬ

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

ДЕМО

СКАЧАТЬ

Вертикальное раскрывающееся меню типа аккордеон в стиле flat design. Простое в понимании и стилизации.

В меню также отображается количество дочерних элементов у родителя, если они есть.

Класс has-sub указываем у тех пунктов, у которых есть дочерние элементы.

 

ДЕМО

СКАЧАТЬ

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

ДЕМО

СКАЧАТЬ