Path Fly Out menu recreated using React Motion

Path Fly Out menu recreated using React Motion

ReactPathMenu React Motion exports 3 main components, Motion, StaggeredMotion and TransitionMotion. In this tutorial we’ll be taking a look at the Motion component, the one you will find yourself using most of the time. Demo New: https://rawgit.com/nashva

#ReactPathMenu

Read the tutorial here.

  • Components/APP.js uses <StaggeredMotion/> component to achieve the staggering effect.
  • Components/APP_old.js uses setTimeout instead of <StaggeredMotion> to acheive the effect staggering.

Demo

  • New: https://rawgit.com/nashvail/ReactPathMenu/staggered-motion/public/index.html
  • Old: https://rawgit.com/nashvail/ReactPathMenu/staggered-motion/public/index_old.html

To run

  1. npm install
  2. npm start
  3. Open index.html in your favorite browser.

Github Repository

Tags: #React #Menu