Боковое меню с подкатегориями в jQuery

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

Но, что делать если в таком меню имеется бесконечно много подменюшек?

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

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

В скачанном примере обратите внимание, что если в li есть подменю, то после его ссылки обязательно должен быть тег <i></i>

<li><a href="#">Электроинструмент </a><i></i>
<ul>
<li><a href="#">Подкатегория </a></li>
<li><a href="#">Подкатегория </a></li>
</ul>
</li>

Скрипт раскрывает (запоминает) меню родительской категории, если зашли в родитель (работает с относительными ссылками: /catalog/konservy/onas).

Еще одна особенность - можно ставить сколько угодно таких меню на одной странице. Все они расширяются на 100% относительно экрана (div верстка), поэтому данным меню вы сможете задать любую ширину.

Код имеет минимум css и js кода. Так, что он будет очень неплохо смотреться на вашем сайте.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *


Введите капчу: