Jump to content
Search Community

Adjust color of element in a repeating timeline

bromel test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi all

I have created a timeline that repeats a few times but I am wanting to change the colour of each line element when they approach the blue filled window, now this works on the first instance, but has soon has this repeats it starts getting messy. So I wonder is there a way of doing this within the timeline that I have constructed.

 

Many thanks

 

Bromel

See the Pen oNNvEbr by w9914420 (@w9914420) on CodePen

Link to comment
Share on other sites

Hey Bromel,

 

You should definitely use a stagger for this sort of thing. 

 

Besides that, you could either add a .set() at the beginning of the timeline to set the properties including color at the start of each iteration or use the onRepeat callback to set it. 

 

Sorry, I'm on mobile or I'd made a demo for you.

Link to comment
Share on other sites

Hi @ZachSaucier

 

I actually tried something similar to your example, but has you will notice that the timeline will repeat once all the items have completed their staggers, where as in my example I want to create a continuous effect which looks seamless whilst at the same time have the ability to change the line color when it reaches a certain point(time).

 

 

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...