(beginner) onClick button plays just once.

[Jiri 0 Likes (Newbie)]

I am newbie to GSAP and wonder why my menu animates just ones. I would be grateful if you helped to fix the code. Thanks a lot.

See the Pen EqVOpx by jordanboza (@jordanboza) on CodePen

[elegantseagulls 714 Likes (Leader)]

Hi @Jiri

 

It's because your code is using the conditional `menuAnimation.reversed() ? menuAnimation.play() : menuAnimationBack.reverse()` Which plays fine the first time, because `menuAnimation.reversed()` is true, and when that animation is run it sets to false, which, then, isn't reset back to true by your `menuAnimationBack.reverse()`.

 

 

[elegantseagulls 714 Likes (Leader)]

There's more good information on `.reversed()` here:

 

[PointC 11,936 Likes (Superhero)]

Hi @Jiri 

 

Welcome to the forum and thanks for joining Club GreenSock.

 

Using a different animation for reverse can sometimes be a bit tricky. Here are a couple threads that may be helpful.

 

 

That being said, I think a simple toggle would work well in your case. Here's a fork of your pen.

See the Pen wVKRbw by PointC (@PointC) on CodePen

 

Another option is to use one timeline with a pause in the middle. Here are a couple demos I made for different thread answer but they show the general idea.

 

See the Pen oPELMe by PointC (@PointC) on CodePen

 

See the Pen GXQWJw by PointC (@PointC) on CodePen

 

Hopefully that info helps. Happy tweening and welcome aboard.

 

[Jiri 0 Likes (Newbie)]

Guys, thanks. ? Going to read and learn.