juliangarnier / anime

JavaScript animation engine
https://animejs.com
MIT License
50.29k stars 3.68k forks source link

Callback that fires on each individual target #695

Open w0nche0l opened 4 years ago

w0nche0l commented 4 years ago

Is your feature request related to a problem? Please describe. I'm trying to use animejs + CSS animations. I really like how animejs does sequencing/staggering, so I am trying to do a synchronized animation where, if i have a series of letters:

<span class="letter">H</span>
<span class="letter">e</span>
<span class="letter">l</span>
<span class="letter">l</span>
<span class="letter">o</span>

I can change their opacity with animejs, and their scale with css animations by adding a new class (.anim) to them.

I'm using css animations because no other scaling method works smoothly with small text, see here: https://codepen.io/wonjeo/pen/mdVdvmp

Describe the solution you'd like I'd like a callback that fires at the start of EACH target, as opposed to begin, which currently only fires at the beginning of the entire transition.

Describe alternatives you've considered I've tried using setTimeout to be the same duration as the delay i return in the delay function, but this leads to going out of sync.

Thank you for this wonderful library!

williamlarsson commented 4 years ago

I agree. I love anime and use it all the time. But the "lack" of this feature has forced me to move to gsap or other libraries, multiple times.