@gliding9914/basic-drop-down-menu

A simple JavaScript utility to create a dropdown menu that appears on hover. This package provides an easy way to add interactive dropdown menus to your web projects.

Installation

To install the package, use npm:

npm install drop-down-menu

Example

HTML

<div class="drop-down">
	<button>Hover over me</button>
	<ul>
		<li>Item 1</li>
		<li>Item 2</li>
		<li>Item 3</li>
	</ul>
</div>

<script>
	const div = document.querySelector('.drop-down');
	const list = document.querySelector('ul');
	createDropDown(div, list);
</script>

CSS

/* Example styling */
.drop-down {
	/* Styling for the drop down div on hover */
	display: flex;
	flex-direction: column;
	max-width: 200px;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
	background-color: lightgray;
}

ul li:hover {
	background-color: gray;
	cursor: pointer;
}