[Side NavBar Expand and Contract Animation]

Thank you Rodrigo! It is great to have a variety of examples. I am in the process of learning React so it is cool to see how you did this.

 

Thank you again!

[Side NavBar Expand and Contract Animation]

Thank you! This is very helpful! As you can see, I am also pretty green when it comes to JS as well. 

 

Thank you again!

[Side NavBar Expand and Contract Animation]

So I am trying to have a smooth animation where upon pressing the hamburger button, the side nav expands from the left side of the screen to its full width then upon pressing the same button again, constricts back inward smoothly. So it toggles open and closed fine, but the animation for it closing is not working. Also when outside of the codepen environment, when you press the button to open, there is a visible jump where it appears that the nav-wrapper div is made visible then from there expands outward using the TweenMax.to().

I am very new to GSAP so this is probably something easy to fix, but I have been working on it for a few days now with no solution.

 

Thank you in advance for helping!

See the Pen JwEaqB by Ash4741 (@Ash4741) on CodePen