Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
cooganb

Trouble using GetDocumentById for animation info

Recommended Posts

Hi there!

 

I've been trying to follow the "Writing Smarter Animation Code" article. This includes compacting animations into functions, which can then be imported into a master timeline.

 

I'm having some trouble with using DOM element manipulation in the functions. The function in the above example fails when I try to run it, saying `vars` using .GetDocumentById has not been assigned. However, when the logic is moved from function to the body of the JS doc, the animation works (which you can see commented out in the Codepen).

 

Any advice from folks? Thanks in advance!

See the Pen WNNMdrb by cooganb (@cooganb) on CodePen

Share this post


Link to post
Share on other sites

Hey cooganb,

 

The console is throwing an error at this line: 

var tl = TimelineMax(); 

You're missing the new keyword :) 

var tl = new TimelineMax();

Side note, in the next version of GSAP (to be released soon) this sort of error can't happen! 🎇

 

Happy tweening.

  • Like 4

Share this post


Link to post
Share on other sites
11 minutes ago, cooganb said:

Any idea as to why the function is only working for the first ellipse and not the later ones?

You have repeat: -1 on the each inner timeline. So the first timeline of the master timeline keeps getting repeated and the second one is never reached :) You should probably put repeat: -1 on the master timeline instead.

  • Like 2

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.

×