useGSAP() scope acting weird

[gandarufuuu]

Hi all,

I'm trying to apply an animation to a certain scope only, using useGSAPs scope option. The weird thing is, on my local react project it only works, if I add ".current" in {scope: ref.current}. Then, however, it also affects elements outside of the scope. If I only write {scope: ref}, the elements outside the scope aren't affected, but neither are the ones inside the scope.

I tried recreating the issue in this stackblitz, but here's it's working as intended ??
https://stackblitz.com/edit/react-avrbpg?file=src%2FApp.js
 

Any idea, what I could be doing wrong locally? I checked a million times that the ref is on the right div...

See the Pen App.js by edit (@edit) on CodePen.

[gandarufuuu]

Okay, I think I figured it out. I had the ref below the scrolltriger element. If I put it higher up in the DOM, it works. In case anyone has the same problem, I'll just leave this topic.

In my case, ".quotecontainer" is the scrolltrigger, so I had to put the ref higher than that.