Sidebar Sliding Back Upon Clicking Anywhere Outside of the Sidebar

I have created a side bar which slides in and out when I click the hamburger icon in phone view:

The sidebar, however, would only slide in and out if I click the hamburger icon. I would very much like to create and animation effect which allows me to slide the sidebar out when I tap anywhere outside of the sidebar. Could somebody give me some pointers on how I could achieve the effect? Thank you very much!

You might have to add another div that takes up the whole viewport but is behind your nav menu.

Then, make an interaction for it to close itself and the nav menu when tapping on it.

Hi @littleviolette, Can you please update your post with some more information so we can help you faster? Things like screenshots and your environment info really speed things up.

Posting guidelines can be found here: Posting Guidelines for the Design Help Category

Thanks in advance! :slight_smile:

@PixelGeek Thanks for the response. I am having trouble setting the interaction up. If you could further assist me with this, I would really appreciate it!

I have recorded the problems I have here:

@thewonglv My browser is Chrome.

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.