eliphino

Thanks for your insight @Rodrigo! I will continue just dropping in the snippet on page components but would be super interested to see how it would be achieved with context. thanks again! tom

I decided to move scrollSmoother from my layout to the individual page components. Not sure if this is the best approach but it works for me so far...I think.

Hi there, Apologies that this is a nextjs question but thought someone must have come across this scenario already. My question is, do I need to store the 'smoother' instance in some global context in order to use smoother.effects outside of the layout file where Scrollsmoother is instantiated? I've attached a simple example, where Scrollsmoother instantiated in layout.tsx file but I'd like to use it's effects in a page.tsx file. It obviously can't use 'smoother' variable in page.tsx as it only exists in layout.tsx. https://stackblitz.com/edit/stackblitz-starters-ajea61?file=app%2Fpage.tsx Thank you!

@Rodrigo Thanks so much for this info, I really appreciate the extra thought! I love the GSAP community.

@Rodrigo Thanks so much for your quick response, definitely cleaned up the attempt I'd made. I realised the original inspo was probably taken from a GSAP SVG line trail I found so in the forum so I changed some CSS and: https://codepen.io/repetition/pen/eYKVJoO I will go through to GSAP to make sure I actually understand it properly and then convert for use in React. Thanks!

Hi there, I am attempting to create this type of effect that a client has requested: https://webflow.com/made-in-webflow/website/gavril-v4 My version in Codepen is a cut up of the official GSAP quickTo example but I changed to gsap.to so I could use the delay. Mine is kind of like home made McDonalds at the moment, any tips on the best/cleanest/performant way to achieve an effect like this? Kind regards, Tom