gsap Shared Element in GSAP

[danshk]

Hi all, I'm trying to implement this effect in GSAP for tab so that my indicator of my active element flows smoothly, but I can't find an example. Maybe you can give me a hint? Thanks

 

DEMO: https://codesandbox.io/p/sandbox/framer-motion-layout-animations-snxgv?file=%2Fsrc%2Findex.tsx&from-embed=

[GSAP Helper]

When sharing a demo please include the file we should be looking at. Currently you're sharing `index.tsx`, which does not have any GSAP code in it. 

[danshk]

11 minutes ago, GSAP Helper said:

When sharing a demo please include the file we should be looking at. Currently you're sharing `index.tsx`, which does not have any GSAP code in it. 

https://snxgv.csb.app/

You can see an example here

[Rodrigo]

Hi,

 

The demo you shared uses Framer, so there is nothing we can do regarding that.

 

This demo shows how to do something similar with GSAP and the Flip Plugin:

See the Pen XWOVbdz by GreenSock (@GreenSock) on CodePen.

 

This demo shows how to use the re-parenting feature from Flip:

https://stackblitz.com/edit/vitejs-vite-xunf8c?file=src%2FApp.jsx

 

Finally @PointC, one of the superstars in these forums, has this cool demos as well:

See the Pen vVpvBE by PointC (@PointC) on CodePen.

See the Pen rZZGRj by PointC (@PointC) on CodePen.

 

Hopefully this helps.

Happy Tweening!