@modernice/animate-height

animate-height

Animate the height of an element to 'auto' or '0px'.

Install

CDN

<script src="https://unpkg.com/animate-height"></script>

Node

npm install animate-height --save # or yarn add animate-height

Usage

Animate to auto

import { autoHeight } from 'animate-height'

const el = document.querySelector('#example')

const height = await autoHeight(el, {
  duration: 250,
  timing: 'cubic-bezier(.91, .06, .08, .93)',
})

console.log(`Element has a height of ${height}px.`)

Animate to 0px

import { zeroHeight } from 'animate-height'

const el = document.querySelector('#example')

await zeroHeight(el, {
  duration: 500,
  timing: 'ease-out',
})

Default options

autoHeight(el, {
  duration: 300, // Transition duration
  timing: 'ease', // CSS transition timing function
})