Jump to content

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

timeline replay issue

Recommended Posts

Hi guys.  
I'm new to gsap as well as javascript.

I am trying to make 'when user switch to another tab, the timeline effect will replay',but now got kind of stuck..

the effect will show at first, but when I switch to another tab, it won't display.
By the way,I use bootstrap 3.37 for framework.

Here's the codepen

See the Pen GbJYza by UHU (@UHU) on CodePen

Link to comment
Share on other sites

I'm not sure I understand your question - when you say "switch to another tab" do you mean the circles, part1, part2, and part3? Or do you literally mean another tab of the browser? 


I definitely see a problem in your code: 



When you put "()" after the function reference, it tells the browser to call that function immediately, so you're putting the RESULT of that function (whatever is returned) as the event listener which I'm sure isn't what you meant to do. Your tweenAni() function doesn't even return anything. It just creates and executes a timeline immediately. 


If your goal was to call tweenAni() whenever someone clicks on one of the elements in the tweenLi[] list, remove the "()" so you're just passing the function reference in. But again, I'm not really sure what you're trying to accomplish so that may not solve all the problems. 

  • Like 2
Link to comment
Share on other sites

Sorry for my unclear expression.
Yes, "switch to another tab" means clicking the circles part1 , part2 and part3.
Thank you guys @GreenSock for the crisp reply , I just solve the question.;-)

But I think my code is lengthy. is there any way to improve this code?

See the Pen GbJYza by UHU (@UHU) on CodePen

Much appreciated!

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.