Jump to content
GreenSock

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

Need to click twice to start animation

Recommended Posts

Hello good people. 

I have a strange questions. 
I created animation play / reverse, but to start it I need to click twice and after that it works as it's should be...

 

Any suggestion for this weird behaviour?

 

Thanks! ❤️ 

See the Pen aMmpZz by krstivoja (@krstivoja) on CodePen

Link to post
Share on other sites

Change line 2 to this and you'll be all set.

 

var tl = new TimelineLite({paused:true, reversed:true});

 

Happy tweening.

:)

 

  • Like 1
  • Thanks 1
Link to post
Share on other sites

Happy to help. :)

 

Just so you understand what was happening there:

 

Your timeline was paused, but not reversed. So on the first click the ternary operator checks to see if the timeline is reversed. It isn't at that point so the timeline reverses rather than plays. It appears that nothing happened because the timeline is at the beginning and has no place to go when it reverses, but is now in a reversed state. That's why the second click works and the timeline plays. Make sense?

  • Like 4
Link to post
Share on other sites

@PointC Yeah. I was also playing with opacity. and In debug I saw that on first click it's setting opacity and then play. but could not figured out how to fix it. Thanks a lot

Link to post
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.

×