It is slide like jquery slideToggle
, slideUp
, slideDown
.
npm install simple-slide-toggle
import { slideUp, slideDown, slideToggle } from 'simple-slide-toggle'
const $target = document.getElementById('slide-target')
slideToggle($target, 500)
Supports dynamically changing WAI-ARIA attributes aria-hidden
, aria-expanded
. You need to write that attribute in HTML.
<button
id="slide-trigger">Slide Trigger</button>
<div
id="slide-target"
aria-hidden="true"
aria-expanded="false">
Slide content
</div>
const $trigger = document.getElementById('slide-trigger')
const $target = document.getElementById('slide-target')
$trigger.addEventListener('click', () => {
slideToggle($target, 500)
})
slideToggle(target, duration)
- target :HTMLElement
A Slide target element. - duration: :number (default: 400)
A number determining how long the animation will run.