GitHub starsGitHub forksGitHub releaseGitHub issuesGitHub last commitGithub file sizeBuild StatusnpmnpmlicenseAnalyticsOpen Source Love svg1MaintenanceGreenkeeper badge

ForTheBadge built-with-love

Accordion

Front-end accordion widget using max-height written in vanilla ES2017

Install

npm i @three11/accordion

or

yarn add @three11/accordion

or

Just download this repository and link the files located in dist folder:

<link rel="stylesheet" href="path-to-accordion/dist/index.css" type="text/css" media="all" />

<script src="path-to-accordion/dist/index.min.js"></script>

Usage

First, import the module:

import Accordion from '@three11/accordion';

Then initialize a new instance of the module:

const el = doc.querySelector('[data-accordion]');
const accordion = new Accordion(el, (settings = {}));

Settings

The default settings are:

headSelector: '[data-title]',   // Selector for the head element
bodySelector: '[data-content]', // Selector for the body element
hiddenClass:  'is--hidden',     // Hidden class name
activeClass:  'is--active',     // Active class name

License

GNU GENERAL PUBLIC LICENSE Version 3, 29 June 2007