jQuery Responsive Select Menu — адаптивное меню для сайта
Плагин jQuery Responsive Select Menu — простое и эффективное решение для сайта с адаптивным дизайном
В бурный период развития мобильных устройств пользователи стали гораздо чаще выходить в интернет именно с этих устройств и вебмастерам приходится обращать на этот факт самое пристальное внимание. И принимать решение об адаптации своего сайта к новым реалиям. Помимо медиа-запросов, часто непреодолимым препятствием становится адаптация основного меню к меняющимся разрешениям экрана. И наиболее простое решение в этом случае — использование jQuery Responsive Select Menu от автора: MIGHTYminnow . Этот маленький плагин встраивается в существующую навигацию, имеет несложные настройки и позволяет в кратчайший срок сделать меню адаптивным. Для его установки зайдите в Консоль управления на вкладку —Плагины>Добавить новый и в строку поиска введите — jQuery Responsive Select Menu. Нажмите — Пoиcк плaгинoв. Выберите jQuery Responsive Select Menu из списка и нажмите — Уcтaновить. По окончании установки активируйте jQuery Responsive Select Menu. Перейдите на вкладку Параметры и здесь обнаружите одноименную с установленным плагином строку. Выберите ее и попадаете в настройки:
Здесь последовательно вводите ID селектора, отвечающего за ваше меню (например: #nav), его максимальную длину, в третьей строке — символ или знак для выделения подменю, следующая строка — название вашего меню для отображения на странице сайта (например: Навигация) и последнее — отображать или нет название вашего меню в строке навигации. Для настройки внешнего вида перейдите в редактор плагинов и выберите установленный плагин. Далее откройте файл — jquery-responsive-select-menu/jquery-responsive-select-menu.php
и в почти самом низу файла внесите изменения в — .jquery-responsive-select-menu для изменения отображения внешнего вида меню. Потом перейдите в jquery-responsive-select-menu/jrsm.css и добавьте в .jquery-responsive-select-menu строку — width: 100%; На этом основные настройки закончены и в конечном результате должно получится примерно так… а может и лучше. Все зависит от вас.
Из минусов можно отметить невозможность построения многоуровневое меню. Все разделы и подменю отображаются в один выпадающий список. Посмотреть в действии можно на этом сайте, изменив разрешение страницы курсором к минимальному.
Валера Привалов
Спасибо, то что искал много дней и ломал голову как сделать!