Javascript Event Handling Development Tutorials, Guides & Insights

/* styles.css */
.dropdown-menu {
  display: none;
  position: absolute;
  background-color: #333;
  min-width: 160px;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.dropdown-menu.show {
  display: block;
  opacity: 1;
}

dropdownToggle.addEventListener('click', function (event) {
  event.preventDefault();
  const isExpanded = dropdownMenu.classList.contains('show');
  dropdownMenu.classList.toggle('show');
  dropdownToggle.setAttribute('aria-expanded', !isExpanded);
});