ModernDropdown

An easy-to-use dropdown animation for modern web applications.

Installation

npm install @ajoy26/menu-drop-down

Usage

1. Import ModernDropdown into your JavaScript:

   import { ModernDropdown } from "@ajoy26/menu-drop-down";

2. Add the following structure to your HTML:

<button data-dropdown-toggle="myMenuID">Click Me</button>
<div id="myMenuID">
  <!-- Your dropdown content goes here -->
</div>

3. Instantiate ModernDropdown:

const dropdownElement = document.querySelector("button");
new ModernDropdown(dropdownElement);

Every button with a data-dropdown-toggle that matches an id of a menu will now toggle the visibility of the associated menu with a smooth opacity transition.