Как создать модальное окно, открывающееся при закрытии другого модального окна?

Question

[Nik_Set_7]

Не могу разобраться в одном моменте при создании модальных окон.
Нужно создать форму приёма заказа (сделано). При закрытии окна должно появиться новое о "благодарности за информацию". Перерыл все статьи, ничего подходящего не нашёл. Подключение ссылки или label с ссылкой на другое модальное окно не работают.
Само модальное окно у меня сделано на CSS. JS в его создании не используется. Bootstrap не использую, хочу разобраться в основах.
Логика приложения будет строиться на Django, сейчас делаю просто макет.

Подскажите пожалуйста, как должна выглядеть структура закрытии окон на HTML+CSS. Если это не так просто, то JS.

Вот ссылка на страницу из песочницы (черновик + два шрифта не подключаются): https://codepen.io/Nikita_Z/pen/yMdNqZ

Модальное окно появляется при нажатии на "Заказать звонок менеджера в header". В коде оно заключено в тег . В CSS начиная с 144 строки

Как оказалось, плохо искал:
smartlanding.biz/ajax-forma-v-modalnom-okne.html
При этом люди правильно подсказывали, спасибо за советы.

Answer 1

[Петр]

Понятия "модальное окно" в том смысле как оно применяется в windows в web-е еще нету.
У вас просто определенный блок отображается поверх других элементов страницы.
Поэтому логика следующая:
- Создали блок
- Показали
- Удалили.
Нужен новый блок - Опять создали.

Answer 2

[Олег]

Без js не обойтись.
Отловите событие 'click' на требуемом элементе и совершите необходимые действия.

Answer 3

[Максим Тимофеев]

Само модальное окно у меня сделано на CSS. JS в его создании не используется

Очень интересно посмотреть, прям мистика. А где в Вашем примере кнопка, которая его открывает.

Comments

[Nik_Set_7]

"Модальное окно появляется при нажатии на "Заказать звонок менеджера в header". В коде оно заключено в тег . В CSS начиная с 144 строки"

[Максим Тимофеев]

Nik_Set_7: Клик на кнопке вы в css ловите? Или все же в js?

[Nik_Set_7]

При нажатии на кнопку, display окна меняется с none на block

[Максим Тимофеев]

Nik_Set_7: Да, что именно ее меняет, если не js?

[Nik_Set_7]

Максим Тимофеев: Скорее всего я не совсем понимаю, что именно Вы спрашиваете.
Открытие и закрытие окна - через CSS. Открытие и закрытие второго у меня пока не реализовано и поэтому задал вопрос в Toster.
Просмотрите код на досуге)

Answer 4

[Тимур Худиев]

Где то я эти картинки видел уже) Сделай их как backgroun-image и background-size: cover. А то расплывается сильно

Comments

[Nik_Set_7]

Какие именно?)
Если про горы - да, когда-то взял для примера в одном тестовом задании.

[Тимур Худиев]

Картинки балкона)

[Nik_Set_7]

Тимур Худиев: Разве? Это фотографии Челябинской компании по ремонту)
Забавно получилось)

[Тимур Худиев]

Мне кажется на фрилансе где то видел)

[Nik_Set_7]

Тимур Худиев: А, если так, то маловероятно.
Тем более ремонт вещь распространённая