Jump to content
Search Community

new utils.selector function

seven test
Moderator Tag

Go to solution Solved by Cassie,

Recommended Posts

Hi,

 

I wanted to ask for some detail on how is this new selector actually selecting, because console logging something like console.log(q('.x')) ends up with TypeError: Cannot read property 'createElement' of undefined  and I do not know if this is selecting only the outer element or elements nested anywhere inside as well, I wanted to create an animation where one pies of text comes first, than I would like to mimic SplitText plugin by staggering in the opacity of elements so that the rest of the words would show up one after the other and than I would like to change this text with the text plugin to something else. I created a sandbox https://codesandbox.io/s/little-tdd-8jo9s?file=/src/App.js here I would expect that if i select .stagger class which is applied to many elements it will act as querySelectorAll, and by appending '>' at the end each piece would show up after the other, but in my dev env it omits the part with stagger class it and goes straight to textPlugin part, and on sandbox the textPlugin part is not being triggered. Should I provide just the class to be animated or the full path eg: '.right .stagger'?

 

Thanks!

Link to comment
Share on other sites

  • Solution

Hey there Seven

You need to register the text plugin in your sandbox - 'Missing plugin? gsap.registerPlugin() ' in order for that animation to work.

And if you're getting an undefined error when logging out the element I imagine the DOM hasn't loaded at the time you're querying it.

It's similar to calling .querySelectorAll() on that element – rather than on the document – It returns an Array, so you're able to stagger and filter and map over it til your heart's content.

 

Here - this is what you should be getting. (check the console)

See the Pen eYWBgNY?editors=1011 by GreenSock (@GreenSock) on CodePen

  • Like 2
  • Thanks 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...