Добрый вечер.
Описание: Делаю тему для репозитория WP у них новые правила ввели, нужно чтобы была поддержка управления с клавиатуры. В их стандартных темах используется их скрипт, он простой и не красивый, я использовал другой, но в нем нет этой поддержки. Я его чуть изменил, он стал поддерживать это кроме открывания подменю.
Ссылки на статьи того, что нужно сделать
https://make.wordpress.org/themes/2019/08/03/plann...https://make.wordpress.org/themes/handbook/review/...Ссылка на саму тему (яндекс диск)
Ссылка на сам скрипт может кому то понадобится.
Мобильное меню срабатывает при ширине 1024 пикс.
Что есть сейчас и что должно быть:
Табом навожу на значок мобильного меню, оно фокусируется, жму энтер, открывается меню, далее табом спускаюсь к пункту меню с подменю оно фокусируется
![5dd4076269ff9088340115.png](https://habrastorage.org/webt/5d/d4/07/5dd4076269ff9088340115.png)
При следующем нажатии таба фокус должен переходить на стрелку подменю, но он перескакивает на следующий пункт меню, потому что для фокуса стрелка должна быть либо
<a href="#">
либо button но там сделано так что за подменю отвечает label с определенным значением for заменить label на
<a>
или button не помогает, тогда вообще подменю не работает.
Скрипт находится по этому адресу assets/libs/mobile-nav/hc-offcanvas-nav.js
Код того label на 573 строке. Нужно как то изменить логику js чтобы label можно было заменить на
<a>
или что то в этом духе.
Либо второй вариант, есть скрипт управления с клавиатуры assets/js/skip-link-focus-fix.js в нем указано условие, что нужно проверять и в это условие прописать класс этого label сперва этому label нужно прописать класс (строка 573) вот код условия
if ( element ) {
if ( ! ( /^(?:a|select|input|button|textarea)$/i.test( element.tagName ) ) ) {
element.tabIndex = -1;
}
element.focus();
}
как дописать проверку на класс?
Очень нужна ваша помощь. Кто хорошо знает JS посмотрите пожалуйста. Заранее спасибо за потраченное время.