Плагин liMenuVert создает вертикальное многоуровневое меню с неограниченной вложенностью на основе jQuery. Структура меню - самая простейшая, а именно обыкновенный многоуровневый список с ссылками.
Важными достоинствами вертикальное многоуровневого jQuery меню liMenuHor являются: правильная реакция на края страницы, наличия маркеров вложения, бесконечная вложенность и симпатичный внешний вид.
В меню присутствует шаблонизация: "white","black" и "gray". Для использования готовых шаблонов в добавок к основному CSS подключите один из шаблонных CSS.
Если вы желаете создать свой внешний вид, подключите один из шаблонных CSS и исправьте его на свое усмотрение.
Пример работы на JSFIDDLE
BUG FIX
23.05.2013 - Добавлена задержка перед исчезанием выпадающих пунктов
27.04.2013 - Добавлена задержка перед появлением выпадающих пунктов
15.03.2013 - Исправлен баг CSS, который запрещал перенос у длинных строк в меню
28.12.2012 - Фикс под IE7 (положение выпадающих подпунктов)
Подключаемые файлы
<link rel="stylesheet" href="#">
<link rel="stylesheet" href="#">
<script src="/js/jquery-1.8.min.js"></script>
<script src="/js/jquery.liMenuVert.js"></script>
Инициализация плагина
Структура HTML
Самый элементарный многоуровневый список
Комментарии
Уточните пожалуйста что значит "не корректно".
Какой при этом вы используете браузер, какая у браузера версия и какое разрешение экрана.
Вот ошибка:
Uncaught TypeError: Object [object Object] has no method 'liMenuVert' c37-f37.htm:17
(anonymous function) c37-f37.htm:17
k jquery-1.8.min. js:2
l.fireWith jquery-1.8.min. js:2
p.extend.ready jquery-1.8.min. js:2
D jquery-1.8.min. js:2
У вас в строке 268 повторно подключен jquery-1.7.1.min.js
Удалите эту строку, она вам не нужна и все заработает
Спасибо, действительно все заработало
Напишите каким вы пользуетесь при этом браузером (название, версия)
И дайте ссылку на сайт. Уверен, что проблема решаема
Браузер Firefix 18.0.1 В IE-8 меню сразу открывается так, как я писал выше (поверх 1-го уровня). Сайт [ссылка удалена]
Скорее всего это из-за неправильного вывода HTML кода самого меню
У вас каждый вложенный тег "UL" имеет класс "menu_vert". Исправьте!
Проверил, все работает нормально, киньте ссылку на нерабочий пример.
sewteh.com.ua
В файле jquery.liMenuVe rt.js закоментируйте или удалите строки 30 и 31 (это строки для дебага, не заметил их случайно).
если значение категории длинное то выходит за пределы скрин - clip2net.com/s/4KCRDL
css не владею. сам не разберусь. Хотел ваше меню использовать.
нужна помошь :)
15.03.2013 - Исправлен баг CSS, который запрещал перенос у длинных строк в меню.
Скачайте заново архив с demo /files/zip/liMenuVert.zip
Подскажите - возможно сделать задержку 1-2 секунды по наведению на 1-й уровень меню.
Много пунктов 1-го уровня - когда случайно проводишь в зоне меню мельтишит в глазах
Готово, архив обновлен
Спасибо, супер. Размер файлов скрипта выше всяких похвал. Ближайший аналог в 2-3 раза больше (с учетом css)
Провести чуть-чуть по диагонали вниз, так меню второго уровня пропадает.
23.05.2013 - Добавлена задержка перед исчезанием выпадающих пунктов
Перекачайте заново архив
Справа в колонке есть блок "Чем вы можете помочь"
а как сделать что бы категории выпадали при нажатии на них, а не при наведении?
Вот так:
http://jsfiddle.net/yurik417/XmxSr/101/
Меню работало, а остальное на сайте переставало работать.
Решил подключением стандартной библиотеки:
И есть небольшая просьбочка: Можно ли сделать меню "плавно вытекающим" или "исподволь вылезающим", а не выскакивающим, как чёрт из табакерки?
Подскажите, как сделать это меню, чтобы оно располагалась справа, а списки выпадали влево?
Вот так: http://jsfiddle.net/XmxSr/148/
Пошел изучать
подскажите что может быть нет? Уже несколько раз перепроверял и по новой ставил...
подскажите что может быть не так? Уже несколько раз перепроверял и по новой ставил...
Причина в чем-то другом. Если кинете ссылку, я могу посмотреть.
У меня возникла одна сложность. В раскрывающийся список я добавил фотки категорий. Естественно, они раскрываются вертикально. То есть фотка, под ней ссылка, под ней другая фотка и т п. А мне надо, чтобы всё выводилось горизонтально в ряд. Подскажите где подправить. Спасибо!
У меня возникла одна сложность. В раскрывающийся список я добавил фотки категорий. Естественно, они раскрываются вертикально. То есть фотка, под ней ссылка, под ней другая фотка и т п. А мне надо, чтобы всё выводилось горизонтально в ряд. Подскажите пожалуйста где подправить!
Но у него есть одна недоработка. Поясню:
Если выставить задержку на пропадание меню (задержка - очень нужная штука), то при движении мышью по меню, окна начинают наслаиваться друг на друга, получается каша. Происходит это из-за того, что при переходе к новой категории, код не сбрасывает прошлое окно. Т е одно окно висит на задержке, и поверх рядом открывается ещё одно.
Не хватает команды: если вы перевели мышь, то прошлое окно должно мгновенно сбрасываться, не зависимо от установленной задержки.
Ставьте одинаковую задержку на оба параметра:
$('.menu_vert').liMenuVert({
delayShow:1300,
delayHide:1300
});
Видимо придётся кого-то просить править ваш код.
У вас противоречивое пожелание:
вы хотите чтобы меню закрывалось через определенное время, и одновременно хотите, чтобы оно закрывалось сразу.
Определитесь зачем вам нужна задержка.
В интернет магазине, с большим количеством категорий и вложений,
клиенты на приличной скорости перебирают меню.
Если выставить задержку отключения, то меню превращается в кашу при быстром
переборе. А если сделать, как вы советуете (то есть врубить задержку появления
равную отключению) - то окно будет всплывать, когда посетитель наводит мышь совсем
в другом месте. Тобишь наводил на одно, а видит другое.
Поэтому даже в древних Js-меню, которые стоят в CMS - при наведении на следующий
пункт отрубается задержка, на сколько она бы не была выставлена.
Задержка нужна только для одного - когда промахиваются мышью мимо меню, чтобы
можно было в него тыкнуть, а не открывать заново и не делать много лишних кликов.
Поэтому вас тут кто-то совершенно естественно и попросил добавить такую функцию.
Только пожалуйста не пишите снова, что вы меня не поняли, противоречий никаких.
Причина наличия задержки совсем не в:
"когда промахиваются мышью мимо меню, чтобы можно было в него тыкнуть"
Задержка нужна для выбора подкатегории, перемещая курсор мыши по диагонали.
Если вам нужна задержка только для "промахивания", то вот http://jsfiddle.net/XmxSr/200/
Теперь значения старта и закрытия можно настраивать
независимо друг от друга.
Выставил 0 и 1300
Только появилась проблема:
теперь этот код блокирует всё остальное на странице,
что работает на Jquery.
Допустим у меня есть бегущая строка на Jquery,
как только я открываю всплывающее окно на меню -
строка застревает и больше уже не двигается,
даже если меню закрыть.
Да, это очевидно, там глобальный сброс таймеров. Если у вас стоят другие плагины, то такой вариант не подойдет.
Берите вот этот:
http://jsfiddle.net/XmxSr/202/
Больше никакие джиквери не застревают, но если
быстро провети мышью по меню, например снизу вверх,
то могут отрыться одновременно 3-4 окна друг на друга и замереть. Если тронуть мышь, всё закрывается и дальше нормально
Если постоянно проверять, то раз 2-3 минуты стабильно
такая беда. Очень хочется ваше меню использовать.
На вашем примере вертикальных начальных категорий мало, у меня не получилось такое повторить. Но возможно, у меня ещё много скриптов на джиквери, а у вас в примере только один. Может поэтому и не получается повторить.
Беспокойте! Главное чтобы по делу.
Благодаря таким как вы пользователям плагины и доводятся до ума.
Вот исправил: jsfiddle.net/XmxSr/204/
Меняйте класс:
.arrow-right {
top:13px;
right:8px;
border-left-color:#666;
}
Никак.
Прокрутка осуществляется с помощью свойства "overflow",кото рое скроет в свою очередь выпадающие списки.
Слайдер перестает работать. Что можно сделать?
оставьте только 1.4.2
и в плагине меню функцию "on" замените на "bind"
вот так:
http://jsfiddle.net/yurik417/XmxSr/227/
Пользуюсь вот этим вариантом
jsfiddle.net/XmxSr/204/
Есть такое неудобство:
Если посетитель навёл мышь на меню внизу страницы, то меню открывается вниз, т е видно его верх, а содержимое оказывается "под экраном".
Не помню на каком сайте видел похожее меню, там если навести мышь внизу страницы, меню вместе с содержимым страницы плавно сдвигается вверх. То есть не возможно создать ситуацию, когда появившееся сбоку меню не полностью отображается на странице.
Возможно ли такое решение для
jsfiddle.net/XmxSr/204/ ???
Попробуйте спросить на форумах joomla
Пример http://new.rozetka.com.ua
Можно, но с этим меню такой функционал ничего общего иметь не будет
Отличный плагин меню, давно им пользуюсь. Есть ли возможность добавить поддержку сенсорных дисплеев (например планшетов) так, что бы при использовании мыши выпадало меню при наведении, а при сенсоре - меню выпадало при нажатии на пункт?
http://demo.masscode.ru/lishopen/index.html
RSS лента комментариев этой записи