[Make a tween that animates nothing]

Thanks @Rodrigo, that solved my problem! Based on your TweenLite example, I solved it by passing in an empty object as the target

[Make a tween that animates nothing]

I'm have a function that takes an html element, and animates it (using gsap). Thing is, sometimes I don't want to animate anything, I just want to wait for some duration, before proceeding with the subsequent animations. I know I can do that with JS promises and setTimeout, but it's important that I should be able to .pause(), .resume() and .timescale() this "nothing" animation (using these method names, for convenience).

 

How can I do that? I've tried feeding in undefined and "" (empty string) to the target parameter (I'm using TimelineMax.fromTo), but that hasn't worked.

[How to animate using css variables as target values]

Awesome, thanks, that already works for me. You sure there isn't a more concise way, though?

[How to animate using css variables as target values]

I'm trying to animate my properties using a css variable as a targets in my gsap code. To be clear, I'm not trying to animate the variable itself, I'm trying to animate the color property on my elements.

 

Can't find a way to make it work. Is it possible?

See the Pen gOYqxme by habit25 (@habit25) on CodePen