My blog GitHub npm

React Animate Height

Lightweight, no dependency React component for animating height using CSS transitions. Slide up/down the element, and to any specific height. Check the demo lower on this page.

CSS classes are applied in specific animation states, check animationStateClasses prop.

Detailed documentation is available on GitHub

Usage

Import the component, and use it to wrap content whose height you want to animate.

import AnimateHeight from 'react-animate-height';

<AnimateHeight
  duration={ 500 }
  height={ 'auto' }
>
  <h1>Your content goes here</h1>
  <p>Put as many React or HTML components here.</p>
</AnimateHeight>