github

nitin42 / animate-components

  • среда, 31 мая 2017 г. в 03:12:30
https://github.com/nitin42/animate-components

JavaScript
Elemental components for doing animations in React



Animate Components

downloads website version

Elemental components for doing animations in React

Install

npm

npm install animate-components --save

yarn

yarn add animate-components

Features

  • Component based
  • Supports all the animation properties
  • Use with styled-components, Aphrodite and glamor
  • Create a new animation using <Merge />
  • Isolated keyframes
  • Validate DOM nesting
  • Element type rendering of components using as prop
  • Add all the html attributes supported by React along with component props.

Docs

Check the complete documentation here.

Animations

Below is a list of all available animations.

Bounce

  • Bounce
  • BounceUp
  • BounceRight
  • BounceLeft
  • BounceDown

Fade

  • FadeIn
  • FadeInUp
  • FadeInRight
  • FadeInLeft
  • FadeInDown
  • FadeInUpBig
  • FadeInLeftBig
  • FadeInRightBig

Flip

  • Flip
  • FlipX
  • FlipY

LightSpeed

  • LightOut
  • LightIn

Rotate

  • RotateIn
  • RotateRight
  • RotateLeft
  • RotateUpRight
  • RotateUpLeft

Slide

  • SlideUp
  • SlideDown
  • SlideLeft
  • SlideRight

Special

  • Flash
  • RollOut
  • RollIn
  • Rubber
  • Swing
  • Zoom
  • Hinge
  • Pulse
  • ExpandUp
  • Entrance
  • Hatch

🚀 New

Perspective

  • PDown
  • PUp
  • PLeft
  • PRight

Bingo

  • PuffOut
  • PuffIn
  • VanishOut
  • VanishIn

Expanse (in space)

  • ExpanseUp
  • ExpanseDown
  • ExpanseLeft
  • ExpanseRight

Other animation libraries (css)