Модальное окно (popup) практика HTML CSS JavaScript

В этом видео мы создадим модальное окно, используя HTML, CSS и JavaScript, без библиотек.

исходники: https://github.com/maksim-leskin/proj...
готовый код: https://github.com/maksim-leskin/proj...

Функционал:
— Модальное окно ровно по центру
— Закрытие окна при клике мимо окна
— Закрытие окна при нажатии на клавишу «Escape»
— Скролл модального окна

Тайм-коды 🕒

00:00 Приветствие и обзор исходников
00:28 Пишем HTML-код модального окна
01:20 Пишем стили, располагаем окно по центру
04:34 Скролл модального окна и другие мелочи
10:56 Пишем скрипт для открытия модального окна
14:56 Закрытие модального окна по крестику и при клике мимо окна
10:56 Пишем скрипт для открытия модального окна
18:18 Открытие окна на несколько кнопок
19:40 Оформляем весь код в функцию
23:54 Закрываем окно по нажатию на клавишу «Escape»
26:06 Добавим параметр: скорость анимации
28:26 Итог



Готовый код:
https://github.com/maksim-leskin/proj...

Автор — Максим Лескин

👀 Подписаться на канал: https://bit.ly/3CoaLCL
🌍 Наш сайт: https://methed.ru/
😃 ВКонтакте: https://vk.me/methed


#methed #javascript #frontend