Drop list

Pure HTML

tsc script.ts

document.addEventListener("DOMContentLoaded", () => {
  const dropdowns = document.querySelectorAll(".dropdown");

  dropdowns.forEach((dropdown) => {
    dropdown.addEventListener("mouseover", () => {
      const dropdownContent = dropdown.querySelector(
        ".dropdown-content",
      ) as HTMLElement;
      if (dropdownContent) {
        dropdownContent.style.display = "block";
      }
    });

    dropdown.addEventListener("mouseout", () => {
      const dropdownContent = dropdown.querySelector(
        ".dropdown-content",
      ) as HTMLElement;
      if (dropdownContent) {
        dropdownContent.style.display = "none";
      }
    });
  });
});

HTML Drop listCSS Drop listJS Drop list