[DJI Mavic vertical pinned sticky]

Hey GSAPers!

Im trying to achieve a DJI Mavic 3 like animation (https://giphy.com/gifs/hf3oNBhJNCBbRePt9x/fullscreen that you can see there: https://www.dji.com/fr/mavic-3-classic?site=brandsite&from=nav) but dont know where to start!

I've saw something like  but its not exactly the same base point because in this case the images would be inside the panel, not overlay one by one ... Did you guys knows How I can achieve the exact same animation ? (sticky image content, but vertical images overlays...?!) 

Thanks for your help !

See the Pen jOZVrZM by akapowl (@akapowl) on CodePen

[Menu reveal GSAP]

Thanks for your help, I finally found out the solution for the « In » transition : 

See the Pen zYzzzMo by laurent-pnt (@laurent-pnt) on CodePen

 same for the « Out » transition : 

See the Pen XWggowE by laurent-pnt (@laurent-pnt) on CodePen

 

I merged the both in one through my js and it works perfectly.

[Menu reveal GSAP]

@CassieThanks for your reply, clip path is not what I need because (take a look at https://bounds.agency/) there's a morphing shape for the menu reveal... What I need (but can't achieve) is my exactly like my codepen (  ) but, without the blue part (the blue part is supposed to act like a mask I could say...) in my codepen I've got the same result than bouds.agency but instead of seeing the website (my red part) I see the blue part... Am I clear enough ? ^^ 

[Menu reveal GSAP]

Thanks/Merci @nico fonseca for your reply,

In fact, thats not quite like your exemple, what Im trying to achieve is exactly this (in my codepen) :  but considering that the blue part should be red (transparent)... Did you got any idea... ?

[Menu reveal GSAP]

Hello!

I would like to have some help please about using GSAP & Morth,

I'm trying to achieve some animations using GSAP & svg morphing to get something similar to https://bounds.agency/ (the menu reveal animation when click on the top right burger)...

By now, all I get is : 

In my version, the blue shape it not revert like it should be (like the exemple)...

Please I need help!

See the Pen wveeywz by laurent-pnt (@laurent-pnt) on CodePen