transition-height

Don't you often run into the problem that CSS can only transition to a set height and not to an element's full height? That's why this micro library exists. transition-height allows you to transition the height of an element from its full dynamic height to 0 height and back with an easy interface!

Installation

npm install transition-height

Usage

import {toggle, expand, collapse} from 'transition-height';

const element = document.getElementById('myElement');

// Expand the element to its full height
expand(element);

// Collapse the element to 0 height
collapse(element);

// Collapse the element to 100 pixels of height
collapse(element, 100)

// Toggle between expanded and collapsed state
toggle(element);

// Toggle between expanded and collapsed to 100 pixels
toggle(element, 100)

// Toggle between expanded and collapsed state, save whether or not the element started to collapse or expand
const isExpanding = toggle(element)