The mod.dropdown_button()
method automatically attaches event listeners for all <div class="mod-dropdown-button"></div>
tags on the page and handles interaction events for the elements.
Method API
// Using mod(-plus).iife.min.js
window.mod.dropdown_button();
// Using mod(-plus).esm.min.js
import { dropdown_button } from 'path/to/mod(-plus).esm.min.js';
dropdown_button();
Usage Examples
Use the following usage examples to guide your implementation.
Examples Use Global JavaScript
For simplicity, all usage examples demonstrate usage with Mod's global JavaScript library (mod(-plus).iife.min.js
). All documented behavior is identical in the ESM variant of Mod's JavaScript library.
Dropdown Button HTML
<div class="mod-dropdown-button">
<button class="mod-button mod-button-icon-suffixed">Settings <i class="mod-icon-chevron-down"></i></button>
<div class="mod-dropdown">
<!-- Rest of HTML for dropdown... -->
</div>
</div>
Dropdown Button JavaScript
window.mod.dropdown_button();