Задать вопрос
@Renhor

Модальное окно и 3 анимированные формы в нем. При нажатии на TAB все перемешивается, как исправить?

Сабж. Выложил на бесплатный хостинг renhor.zzz.com.ua

При нажатии на логин/регистрация открывается модальное окно. Работает так:
Первый контейнер - div для отрисовки затемненного фона.
Второй контейнер - в нем содержатся абсолютно позиционированные 3 формы справа от границы контейнера. При переключении между формами, этот контейнер принимает размеры текущей формы.

При навигации с помощью TAB сами можете увидеть что происходит.

Хотелось бы получить подсказки по решению, пока склоняюсь к тому что нужно:

1) При открытии модального окна - блокировать таб на главной странице (не знаю как).
2) Пока открыта текущая форма, таб должен работать только на ней.(не знаю как)

Под *не знаю как* подразумеваю - не знаю какие инструменты использовать и как их использовать.

Нашел в яндексе 2 полезные статьи, но оптимизировать под мой случай с тремя формами не смог.

Больше прошу не готовых решений (но если такие есть под МОЙ СЛУЧАЙ, то не откажусь и, думаю, разберусь), а подсказок и инструментов для решения (НЕ БИБЛИОТЕКИ, интересует чистый js).
  • Вопрос задан
  • 219 просмотров
Подписаться 1 Оценить Комментировать
Решения вопроса 1
DirecTwiX
@DirecTwiX
"display: flex;" уже предлагали?
Вот что нашёл:
Keep tabbing within modal pane only
В принципе, получилось. Вот результат:
https://codepen.io/DTX/pen/dVYgMZ

Можете попробовать очистить окошко js, чтобы посмотреть, как работает TAB без дописок.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы