Показать сообщение отдельно
  #7 (permalink)  
Старый 21.07.2018, 13:34
Профессор
Отправить личное сообщение для s24344 Посмотреть профиль Найти все сообщения от s24344
 
Регистрация: 12.08.2015
Сообщений: 206

Всё же решил более подробно описать задачу. И попросить вашей помощи:
#app

  a.some-links link
  a.some-links link

  ul.list
    li.list__item
      a(href="#" data-nav-id="_1").list__link First

    li.list__item
      a(href="#" data-nav-id="_2").list__link Second

    li.list__item
      a(href="#" data-nav-id="_3").list__link Third

  ul.nav
    li(data-nav-id="_1").nav__item
      a(href="#").nav__link first

      .nav__popup
        ul.nav__popup-list
          li.nav__popup-item
            a(href="#").nav__popup-link first 1
          li.nav__popup-item
            a(href="#").nav__popup-link first 2

    li(data-nav-id="_2").nav__item
      a(href="#").nav__link second

      .nav__popup
        ul.nav__popup-list
          li.nav__popup-item
            a(href="#").nav__popup-link second 1

    li(data-nav-id="_3").nav__item
      a(href="#").nav__link Third

      .nav__popup
        ul.nav__popup-list
          li.nav__popup-item
            a(href="#").nav__popup-link third 1

  a(href="#").nav-pane pane

  a.some-links link
  a.some-links link


Должно работать как данном примере: http://www.kentfa.com/

При первом нажатии на tab, первый элемент a или button принимает focus, после чего в default порядке происходит смена focus, но когда focus принимает .list__link, далее при нажатии на клавишу tab, focus переходит на .nav-pane(без фокуса он скрыт). Далее мы нажимаем на enter (space), фактически это событие click, и появляется .nav__item (с соответствуещей привязкой по data атрибутам), далее мы при нажатии на tab также меняем фокус по default порядку. Когда же будет последний элемент .list__item, мы в последний раз перейдем на .nav__popup, и далее вниз по a (button). И также важно, что default навигация, смена focus, при shift + tab, также корректно работает.
Ответить с цитированием