Jump to content


GSAP animation

Moderator Tag

Recommended Posts

How to enable GSAP for other Nav Menus that do not interfere with each other and switches to the corresponding menu by clicking on each menu?

See the Pen dygEmVe by ShahramShakiba (@ShahramShakiba) on CodePen

Link to comment
Share on other sites

Hi @Shahram welcome to the forum!


What I would do is create timelines for each animation "open navigation", "shop panel", "blog panel" and  "contact panel". Then animate "open navigation" and the menu item that is clicked. Then when clicking on blog check if "open navigation" has already played and reverse the panel that has already been clicked. 


If the animation "open navigation" has not been clicked it probably means that none of the panel  animations has been played. 


// Person clicks shop, then blog
Animate "open navigation
Animate "shop panel"
// User now clicks blog "open navigation" als already been open
Reverse "shop panel"
Animate "blog panel"


As a side note: is there any reason you're loading GSAP 3.9.1? Where are currently one version 3.11.5 and you're using the old GSAP 2 syntax the GSAP 3 syntax is much easier and more readable check out https://greensock.com/3-migration/

  • Like 4
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.