Как закрыть поп ап окно?

Question

[CAMOBAP4UK]

https://codepen.io/camobap6/pen/Rwrjzqo
Что то я запутался как писать скрипт. Нужно что бы при нажатии на зеленую кнопку окно открывалось , а при нажатии на синию закрывалось

Comments

[CAMOBAP4UK]

Забыл уточнить. Без jquery , только js

Answer 1

[cython]

Когда поставили form.style.display = "flex", то его свойство none пропало и он отобразился. Это свойство нужно устанавливать конкретно перед отображением окна.

const openButton = document.querySelector(".profile__Info-button");
const closeButton = document.querySelector(".profile__buttonClose");

openButton.addEventListener("click", showForm);
closeButton.addEventListener("click", closeForm);
function showForm () {
  document.getElementById("form").style.display = "flex";
}

function closeForm(e) {
  document.getElementById("form").style.display = "none";
}

Comments

[CAMOBAP4UK]

Cпасибо что подправили

[CAMOBAP4UK]

cython скажите а как скрипт понимает что profile__Info-button эта та кнопка , при нажатии на которую форма открывается ? мы же нигде эту кнопку в отличии от profile__buttonClose в коде не указали . Как это в данном случае работает ?

[cython]

CAMOBAP4UK, да ошибка вышла, нужно указать класс profile__Info-button. Скрипт это не понимает, просто у вас есть класс profile__Info. И если в нём нажать на любое место, то откроется форма. Исправление:

const openButton = document.querySelector(".profile__Info-button");

[CAMOBAP4UK]

cython Благодарю