Hey Guys!
I'm creating a website with React that has a menu button that opens a drawer for mobile/tablet.
I'm using the MUi drawer (temporary drawer, left) and it *almost* works great. In Chrome for IOS, there's a bug with css transitions in which if you switch tabs and come back, the animation gets worse and after three times, the animation stops instantly.
I came across gsap/motion/react spring, all of which work great with the chrome iOS bug as they don't use css transitions.
Problem is my JS skills are weak (slowly improving) and I've no idea how to recreate the MUI drawer from scratch using GSAP. I get by with modifying existing examples.
A bit of a long shot but does anyone have any recent codepens that function similar to the MUI example?
- Click on the menu, opens drawer.
- Click on a close menu button, closes drawer
- Click on the remaining body, closes drawer
https://mui.com/material-ui/react-drawer/
Thanks in advance if anyone has any examples they can share if they've made any in recent months.