Jump to content
Search Community

mdvoy

Members
  • Posts

    2
  • Joined

  • Last visited

mdvoy's Achievements

0

Reputation

  1. @Rodrigo It's alive. Thanks a lot ?. My start point is here: https://codesandbox.io/s/lp94nrow1l
  2. Hey everyone. It's a very great topic. I am new to GSAP and very interested in. I have this code: render() { return ( <Route render={({ location }) => ( <TransitionGroup> <Transition key={location.key} timeout={400} onEnter={this.onEnter} onExit={this.onExit} > <Switch location={location}> <Route exact path="/" component={CardBegin} ref={this.myRef} /> <Route path="/step-1" component={CardStepOne} /> </Switch> </Transition> </TransitionGroup> )} /> ); } 1. use react-transition-group (http://reactcommunity.org/react-transition-group) 2. use guide from react-router documentation Here In total. Have different keys for two transitions but that I can implement gsap animation from ./animathion.js I need create a ref to DOM node, because my function has two parameters (DOMnode, callback) show(target, cb) { return TweenMax.from(target, duration, { opacity: 0, height: 0, onComplete() { cb(); }, ease: Elastic.easeOut.config(0.25, 1) }); }, How can I pass there DOMnode for implementation animation? onEnter = () => { animation.show(DOMnode, cb); }; Many thanks.
×
×
  • Create New...