rt861
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by rt861
-
-
Hey everyone, I am a beginner to gsap/animation with JS and I am currently trying to implement some advanced animations with `react-gsap` and `react-scrollmagic`. I currently have a somewhat working version which implements section wipes and tweens a div around the screen.
The next step I'd like to take is being able to animate "exploding" the div (grey one with "test" text) into many smaller divs/images - and then also rebuild it back into the div as the user scrolls through the different sections.
I'm quite lost on where to even begin with something like this, so I was hoping someone could point me to a similar example or at least which documentation I should be reading to further my understanding with this concept in mind.
I wasn't able to get a js playground of my code working, but I am still going to share the link as it at least formats my current code nicely and I've attached a video of what it currently looks like: https://codesandbox.io/s/react-playground-forked-47kir?file=/Demo.js
Thanks
react-gsap Explode div into many
in GSAP
Posted
Hey OSUblake thanks for all the info. I'm experienced with js/react just knew to the scrollmagic/gsap side of things, I'll think about ditching ScrollMagic and just use straight up scrolltrigger and gsap in react rather than raect-gsap/scrollmagic.
Not sure why my video refused to attach, I'll try and fix that. And yeah my codesandbox kept running into random errors with react-gsap/scrollmagic that I couldn't recreate locally.
That demo is really handy, thanks.