es6-slide-up-down
Vanilla JavaScript micro function for animated slideUp/slideDown of elements written in ES6. The behavior equals jQuerys' slideUp and slideDown methods. It uses requestAnimationFrame and has no external dependencies.
See demo here: https://janrembold.github.io/es6-slide-up-down/example/
Installation
yarn add es6-slide-up-down
// or
npm install es6-slide-up-down
Usage
; // grab some html elementconst element = document ; // shorthand - slide up (close) element - Defaults: duration: 400ms, easing: easeOutQuad; // ...equals to ; // change animation duration [in ms]; // ...equals to; // change easing function, see https://github.com/janrembold/es6-easings;; // slideDown has exactly the same options and usage
Options
The slideUp
and slideDown
methods take a single HTML element as first parameter.
Second and optional parameter might be an Object
or the animation duration as positive Integer
.
{
duration: [Integer], // optional, defaults to 400
easing: [function] // optional, defaults to 'easeOutQuad'
}
duration
(optional)
The animation duration in milliseconds. Defaults to 400
easing
(optional)
The easing function that is used to calculate the animation. See https://github.com/janrembold/es6-easings for easing variations. Defaults to easeOutQuad