This has been archived. If you're looking for a solid implementation of an animation engine/FLIP style animations that are easy to use I highly recommend checking out Framer Motion.
The latest update with the animate
prop truly is the nail in the coffin for Element Motion - it does everything this library does and more with a fantastic API.
Check it out here: https://www.framer.com/motion/
Tween between view states with declarative zero configuration element motions for React.
Dynamic motions as easy as:
<Motion triggerSelfKey={isLarge}>
<Scale>{motion => <div {...motion} className={isLarge ? 'large' : 'small'} />}</Scale>
</Motion>
Check out our example motions and then once you're done have a look at the docs.
Element Motion requires React 16.4 or greater.
npm install @element-motion/core --save
or
yarn add @element-motion/core
There are two halves to Element Motion:
- Orchestration (collecting DOM data, enabling motion between disconnected React elements, executing motions)
- Motions (animation concerns, CSS transitions/animations, JS animations, whatever you can imagine)
- First time here? After installing head over to Getting started to start learning the basics
- Interested in elements in motion? Check out Focal motions
- For ready made experiences check out Composite experiences, just grab them and go!
- Having trouble? Maybe Troubleshooting has your answers