Dropdown js component for web sites

Install

$ npm i andy-dropdown

Use

import Dropdown from 'andy-dropdown';

then you have to init the component:

Dropdown.init();

There is Html example code to understanding the process

<div data-dropdown //init dropdown on element
     data-click-close //init close dropdown when click on items if you want
     >

    <button>Dropdown button</button> //button to expand dropdown

    <div data-dropdown-body="hide"> //dropdown body element
        
        <div data-dropdown-sub='hide'> //dropdown body menu item, which may be sub dropdown element
            <h4>Menu item element</h4>
            <div data-dropdown-sub-body="hide"> //sub dropdown element
                Here is sub items
            </div>
        </div>
       
    </div>
    
</div>

REQUIRED CSS

main css code

*[data-dropdown-body="hide"] {
    display: none;
}

*[data-dropdown-body="show"] {
    display: block;
}

*[data-dropdown-sub-body="show"] {
    display: block;
}

*[data-dropdown-sub-body="show-left"] {
    display: block; //styles for sub body when it place on right side of window
}

You have to style your dropdown any way you want ))