0.1.5 • Published 3 years ago

simple-slide-toggle v0.1.5

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

SimpleSlideToggle

It is slide like jquery slideToggle, slideUp, slideDown.

Installation

Install via npm:

npm install simple-slide-toggle

and include in project:

import { slideUp, slideDown, slideToggle } from 'simple-slide-toggle'

Usage

simple use

const $target = document.getElementById('slide-target')

slideToggle($target, 500)

with HTML

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)
})

Parameters

slideToggle(target, duration)
  • target :HTMLElement
    A Slide target element.
  • duration: :number (default: 400)
    A number determining how long the animation will run.