Draw SVG change direction WITHOUT fromTo tween

[jakob zabala]

This solution works but... I am struggling with the direction of the stem. I can only get it to work with a fromTo tween... but if the animation isn't finished then the stem animates in from 100 to 0. (using mouseenter and mouseleave event listeners)

 

is there another way to flip the starting point and ending point of a path without fromTo?

 

Thanks!

See the Pen RwKGorQ by jaykobz (@jaykobz) on CodePen.

[PointC]

Hi @jakob zabala 

 

It's usually best to create the timeline outside of your event handlers and then play()/reverse() on hover so you don't get those weird overwrites.

 

Make sense?

 

Happy tweening.

 

[jakob zabala]

Aaah yes of course, never needed to use that until now! I knew it was a simple solution, thank you!!