HTML/CSS | Разворачивающийся-сворачивающийся список

Question

Есть вот такой блок:

код html (стили прикреплять не буду, слишком много кода):

<div>
    <div>SERVER MANAGEMENT</div>
</div>
<ul>
    <a>Приветствия</a>
    <a>Модератор</a>
    <a>Реакции с ролями</a>
</ul>

Нужно сделать так, чтобы при нажатии на SERVER MANAGEMENT список ul сворачивался, а при повторном нажатии разворачивался.

Как это можно реализовать?

Answer 1

$('.menu-header').on(`click`, function() {
  $(this).next().stop(true).slideToggle();
});

ul {
  display: block;
  background-color: gray;
}

ul a {
  display: block;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="menu-header">
  <div>SERVER MANAGEMENT</div>
</div>
<ul>
  <a>Приветствия</a>
  <a>Модератор</a>
  <a>Реакции с ролями</a>
</ul>

БЛОГ НА HUSL

HTML/CSS | Разворачивающийся-сворачивающийся список

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