Hide/Show Navbar On Scroll & Sidebar on Navbar Hover

Design help Animations & Interactions
1

Hi all.

This is my first forum post. I usually tinker for hours before asking for help, but I’m really stumped.

Created a hide/show “navbar” scroll animation, but it cuts off the animation for hiding/showing my “sidebar” when hovering over the “explore” button.

Before hover:

Screen Shot 2020-06-12 at 10.32.30 PM
Screen Shot 2020-06-12 at 10.32.30 PM2880×1000 240 KB

After hover (cuts off at nav bottom):

Screen Shot 2020-06-12 at 10.32.41 PM
Screen Shot 2020-06-12 at 10.32.41 PM2880×1024 242 KB

After switching to “overflow,” it loses white background color despite cranking up z-value to 2000:

Screen Shot 2020-06-12 at 10.34.09 PM
Screen Shot 2020-06-12 at 10.34.09 PM2880×1576 687 KB

Would like it to look something like this on hover:

Screen Shot 2020-06-12 at 10.41.01 PM
Screen Shot 2020-06-12 at 10.41.01 PM2880×1578 365 KB

Any help would be really appreciated.

Here is my public share link: LINK
(how to access public share link)