Как сделать чтобы меню открывалось и закрывалось по нажатию JavaScript

Question

Как сделать чтобы меню открывалось и закрывалось по нажатию на него или в любое другое место с помощью JavaScript ?

.dropdown {
  width: 227px;
}

.dropbtn {
  width: 227px;
  height: 40px;
  cursor: pointer;
  background-color: #3b3b3b;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  margin-top: 32px;
  padding: 0;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #3b3b3b;
  width: 227px;
  transition: 0.5s;
}

.dropdown-content a {
  color: #fff;
  text-decoration: none;
  display: block;
  font-size: 13px;
}

.dropdown-content p {
  padding: 10px 0 10px 48px;
  margin: 0;
}

.dropdown-content a:hover {
  background-color: #353535;
  transition: 0.5s;
}

.dropdown:hover .dropdown-content {
  display: block;
}

<div class="dropdown">
  <div class="dropbtn">
    <p>Русский</p>
  </div>
  <div class="dropdown-content">
    <a href="#">
      <p>Русский</p>
    </a>
    <a href="#">
      <p>English</p>
    </a>
  </div>
</div>

Answer 1

document.querySelector("p").onclick = () => {
  if (document.querySelector("div").style.height == 0) {
    setTimeout(function() {
      document.querySelector("div").style.height = "100px";
    }, 2000);
  } else {
    setTimeout(function() {

      document.querySelector("div").style.height = "0px";
    }, 2000);
  }
}

div {
  width: 300px;
  height: 0px;
  background: red;
  overflow: scroll;
}

<p>drop_down</p>
<div>
  <a href="#">ghbvjnn</a>
  <a href="#">vnvjn</a> 
  ...
</div>

БЛОГ НА HUSL

Как сделать чтобы меню открывалось и закрывалось по нажатию JavaScript

Ответы (1 шт):