Страница 1 из 1
Меню Каталог
Добавлено: 02.12.2017, 14:13
slava
Подскажите пожалуйста как дефолтном шаблоне реализовать.
1. Что бы Меню Каталог закрывался при клике вне меню.
или
2. Что бы Меню Каталог открывался при наведении курсора мыши и закрывался при наведении вне меню.
Добавлено: 25.04.2018, 06:58
trainracing
Подскажите, делаю так:
Код: Выделить всё
// Выпадающие блоки
$('.fn_switch .c_menu').hover(function(e){
e.preventDefault();
$(this).parent().next().slideToggle(300);
if ($(this).hasClass('active')) {
$(this).removeClass('active');
}
else {
$(this).addClass('active');
}
});
Блок вылазит при наведении, но пункты меню сразу обратно сворачиваются.
Какой код добавить, чтобы при наведении на каталог меню было активно?
Добавлено: 25.04.2018, 12:21
makki
slava писал(а):Подскажите пожалуйста как дефолтном шаблоне реализовать.
1. Что бы Меню Каталог закрывался при клике вне меню.
Тут эта задача обсуждалась и там же есть решение
или
2. Что бы Меню Каталог открывался при наведении курсора мыши и закрывался при наведении вне меню.
Чтобы меню закрывалось и открывалось при наведении, нужно сделать следующее1) В файле index.tpl 1.1) в строке
добавляем дополнительный класс fn_menu_up, чтобы получилось так:
1.2) Чуть ниже вместо
Код: Выделить всё
<div class="categories_heading fn_switch">
{include file="svg.tpl" svgId="menu_icon"}
<span class="small-hidden" data-language="index_categories">{$lang->index_categories}</span>
</div>
пишем
Код: Выделить всё
<div class="categories_heading fn_menu_down tablet-hidden">
{include file="svg.tpl" svgId="menu_icon"}
<span class="small-hidden" data-language="index_categories">{$lang->index_categories}</span>
</div>
<div class="categories_heading fn_switch lg-hidden">
{include file="svg.tpl" svgId="menu_icon"}
<span class="small-hidden" data-language="index_categories">{$lang->index_categories}</span>
</div>
2) В файле okay.js например после следующей функции
Код: Выделить всё
// Выпадающие блоки
$('.fn_switch').click(function(e){ .... });
добавляем
Код: Выделить всё
/* Главное меню на десктопе */
$('.fn_menu_down').mouseenter(function() {
var menu = $(this);
timer = setTimeout(function() {
menu.parent().find('.categories_nav').slideDown(300);
menu.addClass('active');
}, 300);
$('.fn_menu_up').mouseleave(function () {
clearTimeout(timer);
$(this).find('.categories_nav').slideUp(300);
$(this).find('.categories_heading').removeClass('active');
$(this).off('mouseleave');
});
});
Работоспособность проверена. Учтены все замечания и пожелания
Добавлено: 22.08.2018, 13:08
makki
Маленькое приятное дополнение к вышеуказанному дополнению (открывание меню при наведении мышки). Теперь при наведении мышки, меню не спешит сразу открываться, а только после небольшой паузы. Если за это время мышка убрана, меню не открывается. Это убирает неприятное дергание меню, если вдруг мышка оказалась на объекте.
Исправил инструкцию выше.
Добавлено: 10.02.2019, 06:52
Robox
Спасибо большое! То, что доктор прописал! Уже давно задумывался над данной реализацией, но знаний не хватает. Еще раз спасибо!
Добавлено: 15.02.2019, 09:24
s74464491
В мобильной версии не закриваеться меню
Добавлено: 08.04.2019, 19:10
makki
s74464491 писал(а):В мобильной версии не закриваеться меню
Исправил инструкцию.
Добавлено: 10.09.2019, 00:33
Евгений
В мобильной версии дважды появляется иконка меню, которую необходимо дважды открывать.
- Capture.PNG (2.98 КБ) 5110 просмотров
Подскажите пожалуйста как подправить
Добавлено: 22.09.2019, 20:22
makki
Евгений писал(а):В мобильной версии дважды появляется иконка меню, которую необходимо дважды открывать.
Исправил инструкцию выше.
Добавлено: 23.09.2019, 06:27
Евгений
Спасибо большое, так гораздо лучше! Заметил, что в мобильной версии перестал закрываться каталог при клике вне него. Не подскажите как вернуть обратно эту функцию?
Добавлено: 23.09.2019, 07:05
makki
Евгений писал(а):Заметил, что в мобильной версии перестал закрываться каталог при клике вне него.
А он и не закрывался. Такого нет изначально в движке. А эта доработка это не решает
тут это обсуждалось
Добавлено: 27.01.2021, 21:51
Dysha-Kuzbass
А как для 3.8.1 это реализовать? Т.е., при наведении курсора меню появлялось, а при отвода его (курсора) исчезало!