Jump to content

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

All Master Timeline Animation Start Once Loaded

Recommended Posts

Hi everyone. I have a trouble with master timeline.

I can't figure out why all animations in master timeline start when content loaded.


I want two animations of the computer to switch each 5~7 seconds . It works fine after the delay finishes.

There are Mater timeline on the bottom of codes and functions are top of it.


Could you give me some advises to fix this problem?

Thank you.

See the Pen PoNOJMR?editors=1010 by shunyadezain (@shunyadezain) on CodePen

Link to comment
Share on other sites

Your frist problem is that you're returning the function it self not the time line 


function sw1() {
  var switchTl1 = gsap.timeline();
  // return sw1; // ️ name of the function 
  return switchTl1 //  name of the timeline


Over alI would create a master timeline (you already have that) and create functions of all your animations like you do with `sw1` and `sw2`, but do it also for the keyboard and the coding on the screen and add all those animations to the masterTime line.


Right now there are all kinds of animations that are either playing or not, but are somehow hidden ( I don't know what that means for performance, but I would not animate things that are not visible)

  • Like 4
Link to comment
Share on other sites

Thank you so much! @mvaneijgen I did not notice that.


Some animations were not working after fixing the problem.

But I used eventCallback() in the functions and now it's working! 😁


  function sw1(e) {
    const switchTl1 = gsap.timeline();

    switchTl1.eventCallback("onUpdate", function () {

    return switchTl1;


Link to comment
Share on other sites

Hey Shunya and welcome to the GreenSock forums! I just wanted to say thanks for creating things with GSAP. We've seen your demos that you've been posting to Twitter and tagging us in :) And thanks for supporting GreenSock by being a Club GreenSock member!


Maybe you'll find my article about animating efficiently helpful.

  • Like 1
Link to comment
Share on other sites

Hi! @ZachSaucier I'm happy to be here. This was the first time ask a question because this forums is really big and I'm always able to find my answer 😄

I have learned a lot from this community. And thank you for checking my domos🙏


The your article is great! I will use the techniques next time 👍

Thank you!

  • Like 3
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.