Hi all, New to Greensock so bear with me
I've created a sidebar which is hidden, when you mouseenter the sidebar, it fires TimelineMax to animate the sidebar open. When you mouseleave it reverses that timeline.
This works great. If you hover over the sidebar, even erratically, it behaves as expected. Now, I have a nav item inside the sidebar which, when clicked, fires another timeline which opens a full page subnav.
I set a variable to say this subnav is open so I can keep the sidebar open. So the reverse will only run if the subnav is closed.
If you hover the sidebar and click the button (looks like a little bottle) a full page colourful nav will appear. If you keep you cursor over the button, click it again (to close the colourful nav), then mouseleave the sidebar, it reverses as expected.
If you...
Hover the sidebar click the button mouseleave the sidebar to interact with the colourful nav then go back to the sidebar to click the button again to close the nav THEN mouseleave
The sidebar should close but it remains open, the timeline doesn't reverse. All the variables seem correct so I'm stumped!
I hope this makes sense, I've tried to explain it as best I can. See the Codepen for the working code.
Many thanks!