У меня есть мобильное меню, которое открывается при нажатии на значок. Большинство ссылок меню ведут на другие страницы, но есть также локальные ссылки с атрибутами href='#xxxx' и идентификаторами той же страницы в качестве цели ссылки.
Открытие и закрытие меню запускается скриптом jQuery, который срабатывает при нажатии на значок (во фрагменте ниже: красный квадрат).
При нажатии на локальную ссылку, ведущую к идентификатору ниже на странице, меню остается открытым, чего не должно быть. Я попытался добавить скрипт для закрытия меню при нажатии любого пункта меню, но селектор в этом скрипте, похоже, не работает.
Вот нерабочая версия — обратите внимание на селектор jQuery, объединяющий селектор атрибутов и одноуровневый селектор с другими. Это только мобильная версия, я исключил все медиа-запросы.
Примечание. Тот же селектор работает и в CSS (последнее правило):
У меня есть мобильное меню, которое открывается при нажатии на значок. Большинство ссылок меню ведут на другие страницы, но есть также локальные ссылки с атрибутами href='#xxxx' и идентификаторами той же страницы в качестве цели ссылки.
Открытие и закрытие меню запускается скриптом jQuery, который срабатывает при нажатии на значок (во фрагменте ниже: красный квадрат).
При нажатии на локальную ссылку, ведущую к идентификатору ниже на странице, меню остается открытым, чего не должно быть. Я попытался добавить скрипт для закрытия меню при нажатии любого пункта меню, но селектор в этом скрипте, похоже, не работает.
Вот нерабочая версия — обратите внимание на [b]селектор jQuery, объединяющий селектор атрибутов и одноуровневый селектор с другими[/b]. Это только мобильная версия, я исключил все медиа-запросы.
Примечание. Тот же селектор работает и в CSS (последнее правило):
А вот версия, в которой селектор упрощен, без учета атрибутов и одноуровневых селекторов. Это работает: когда вы нажимаете на любой пункт меню, меню закрывается.
Но мне нужно ограничить функцию ситуацией, когда #navicon_1 имеет статус «aria-expanded=true» — в противном случае меню исчезает на рабочем столе при нажатии локальной ссылки: //Переключение мобильного меню при нажатии на значок навигации jQuery('#navicon_1').on('click', function() { jQuery('#main_nav').slideToggle(300); jQuery(this).attr("aria-expanded", function(i, attr) { //изменяем расширенный статус вернуть атрибут === 'истина'? 'false true'; }); }); jQuery("#main_nav ul li.menu-item").on('click', function () { //alert("СЕЙЧАС ДОЛЖНО РАБОТАТЬ"); jQuery('#main_nav').hide();//закрываем меню jQuery('#navicon_1').attr("aria-expanded", function(i, attr) {//изменить расширенный статус вернуть атрибут === 'истина'? 'false true'; }); }); * { размер коробки: граница-коробка; } #navicon_1 { позиция: абсолютная; справа: 50 пикселей; ширина: 32 пикселей; высота: 32 пикселей; курсор: указатель; дисплей: блок; граница: нет; фон: красный; текстовый отступ: -5000 пикселей; } #main_nav { дисплей: нет; позиция: абсолютная; поле справа: -30 пикселей; верх: 40 пикселей; переполнение-у: авто; справа: 40 пикселей; заполнение: 0 0 0 0; фон: #fff; -webkit-box-shadow: -2px 10px 10px #aeaeae; box-shadow: -2px 10px 10px #aeaeae; } #main_nav>ul { ширина: 230 пикселей; внизу: 0; выравнивание текста: по левому краю; отступы: 8 пикселей 0 8 пикселей 10 пикселей; } #main_nav>ул ли { размер шрифта: 17 пикселей; дисплей: блок; ширина: 100%; высота строки: 1,6; отступы: 4 пикселя 6 пикселей 4 пикселя 8 пикселей; фон: #eee; } #navicon_1[aria-expanded='true']+#main_nav ul li.menu-item { фон: #fb6; [list] [*]Меню 1[/url] [*]Меню 2 [*]Меню 3 [*]Меню 4 [*]Меню 5 [/list]
У меня есть мобильное меню, которое открывается при нажатии на значок. Большинство ссылок меню ведут на другие страницы, но есть также локальные ссылки с атрибутами href='#xxxx' и идентификаторами той же страницы в качестве цели ссылки.
У меня есть таблица (представляющая приложения, но это не имеет особого значения для данного вопроса), и я хотел бы иметь связь «один-ко-многим родитель-потомок».
Мобильная версия