Модальное окно на чистом Java Script, Как сделать модальное окно на JS

В этом уроке я покажу как сделать модальное окно на чистом Java Script.

Донаты:
2. VISA - 4274 3200 3233 1582

[lumeaceaiuluisrl]

Спасибо, что есть люди, благодаря которым мы становимся ближе к своей цели.

[серегапро-йш]

Спасибо большое побольше бы таких уроков

[skatler]

Все очень доступно объяснили, спасибо .

[zimabezsnega]

Спасибо большое без воды и всё понятно)

[anastasiauiux]

Очень пригодилось! Нужн было на чистом js. Спасибо

[masterng]

Очень полезно, единственное замечание, свойство display не анимируется

[АлександрБадаландабад]

Спасибо за видео. Я тысячекратно извиняюсь, но почему у Вас в css в разделе .modal два z-index? Один со значением 1 другой 1000. Второй понятно для чего, а первый ? Опечаточка или так оно надо ?

[VlCepesh]

у window.onclick совершенно ненужный цикл. у нас уже есть event.target, и нам не надо перебирать все подряд. так что можно укоротить до:
window.onclick = function (event) {
if {
event.target.style.display = "none";
}
};
первую половину я бы тоже подправил. зря вы не воспользовались литералом, по-моему с ним гораздо все нагляднее и понятнее. опять же... не зря обновляли js, почему не идти в ногу со временем, а для перевода кода в понятный для всех браузеров язык есть babel (если это требуется). Так что я бы сократил до:
let btns =

for (let i = 0; i < btns.length; i++) {
btns[i].addEventListener('click', function (event) {
let atr =
let modal = = ${atr}]`);
modal.style.display = "block";
modal.querySelector(".close_modal_window").addEventListener('click', () => modal.style.display = "none");
});
}
но, наверное, можно было и еще проще... (как вы упомянули, приvенить for of...)

[_cyborg]

Подскажите, пожалуйста. Как сделать, чтобы модальное окно закрывалось по кнопке esc?

[FAF.W]

есть такое же самое видео, только с реализацией через класс, где класс допустим modal включает только рендер контейнера, методы открытия и закрытия окошка, остановка скролла на бади?

[Ramazan-hh]

Здравствуйте можно можно использовать тег диалог что бы создать мод. Окно?

[ВераСудницына-кг]

Спасибо! У меня вопрос - а стоит ли использовать модальное окно для контента более насыщенного, чем просто сообщение? То есть если у меня в мобильной версии будет модальное окно почти на весь экран и там слайдер и текст, например?

[VlCepesh]

Спасибо! Если можно, размещайте код на GitHub, чтобы поэкспериментировать....

[JavaScriptcher]

Если бы еще файлик с исходником был бы!! Цены не было уроку!!:))

[zapiski_verstalshika]

то есть, если я зайду на сайт с таким модальным окном(у меня нет мышки у ноутбука), то без возможности закрыть окно, кликая на "tab" видя как крутится страница - я просто закрываю вкладку, по тому что не могу нормально просмотреть страницу... То есть заказчик теряет клиента... а человек читающий страницу со скрин ридера вообще подумает что это не сайт а хз что....

[АлексейБогатов-до]

Здравствуйте, я пишу, потому-что у меня возникла относительно не понятная для меня ошибка. Почему, когда я нажимаю на кнопку на своём сайте, то у меня ничего не включается. Хотя весь код, написан правильно вроде никаких не дочётов нету, не могли бы вы попробовать дать какой-нибудь совет?
P.s: Мне урок очень сильно понравился, он был уж слишком интересным!)

[АйнурХаликов-йм]

А это будет работать с многостраничным сайтом или с интернет магазином?

[АзаматМуратов-ыв]

Здравствуйте господа Айтишники.
Проблема такая:
Не работает в самом начале.
Не открывается по клику.
Застрял
Помогите пожалуйста решить проблему