• Теория
  • Теория

Первая программа: «Не надо стесняться»

Кексу понравилось, как вы справились с магазином сладостей. Он спешит дать вам новое задание. В этот раз надо написать код для магазина игрушек ручной работы. Вот точное ТЗ от Босса.

Мяу! Нужно запрограммировать взаимодействие с пользователем.

В разметке есть попап (класс popup).

Клик по кнопке «Показать подробности» (класс button-show) должен вызвать показ окна на странице. У попапа должен появиться класс popup--open.

Клик по крестику в теле попапа (класс button-hide) должен спрятать окно со страницы. Для этого нужно удалить класс popup--open у попапа.

Кроме этого, если окно на странице, а пользователь нажал клавишу ESC, попап тоже должен исчезнуть. Закрытие должно срабатывать только по этой клавише, нажатие на другие клавиши не должны влиять на положение всплывающего окна.

И не забывай, что кнопка «Показать подробности» свёрстана ссылкой. Не забудь отменить переход по этой ссылке.

Жду результата!

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

Хорошо владеете JavaScript, но до сих пор не освоили Node.js? Записывайтесь на профессиональный курс «Node.js. Профессиональная разработка REST API». Цена 12 000 ₽.

Минимальный вид табов
  • index.html
HTML
HTML

Вы перешли на другую страницу

Кликните внутри мини-браузера, чтобы поставить фокус в это окно.

100%
Бабушка Кекс

Притормози, дружище

Проходить вызовы части «Знакомство с событиями» тренажёра «Погружение в браузерный JavaScript» можно после регистрации и оформления подписки.