How to achieve persisting overlay object

Question

I'm using XD to design a website that has a hamburger icon on the top left corner.  Clicking on this hamburger icon will open a left navigation sidebar.  I'm using XD's prototype overlay function to accomplish this to a certain degree.  I am unable to accomplish the following:
 
1.  I'd like for the left navigation sidebar to be visible by default when first entering into the site.  It is currently invisible by default and I have to click on the hambuger icon to make it visible.
 
2.  I'd like for the visibility of the left navigation sidebar to persist throughout the site where clicking on the hamburger icon effectively toggles the sidebar visibility on/off globally.  Currently, everytime I go to a new page, the sidebar is invisible and I have to click on the hamburger icon again to make it visible.
 
Is there any way to accomplish the two issues above?  Thanks!
{Renamed By MOD}

Chris W. Griffith · Accepted Answer

The Sidebar should become a component, this will allow for easier reuse across your prototype. Also, by doing so, you can the set its state. In your case, you will want it to default to 'open'.  To make it easier, you might design it in reverse with the menu open, then you won't have to keep changing its state from artboard to artboard.

Rishabh_Tiwari · Answer

Hi there,

Thanks for reaching out. I found a similar discussion on the community, which you can refer to here: https://community.adobe.com/t5/adobe-xd/how-to-set-up-prototype-to-close-the-side-bar/m-p/11745064#M43417

Let us know if this helps or if you need any further assistance.

Regards

Rishabh

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.