Interaction Initial State Not Working

The mobile menu is atop the page but transparent, so it’s covering part of the header nav.

I’m using an interaction to hide/show the menu. The initial state is set to translate-x: 100% (moves it off screen), and opacity: 0; For some reason, the rendered initial state does in-fact have a 0 opacity, but it’s translate property is set to 0, ignoring the 100% on the initial state.

I’m not sure how to resolve this. Ideas would be appreciated.

Read Only Link

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


Do you mean that you put the Hide/Show property in the interaction?
If not, that could help since that when Display is on None the object doesn’t take space, instead of just having it on a side.
I use this method for my menus.
Hope this helps.

1 Like

@simoneprandini Just wanted to say thanks! That worked :slight_smile:

1 Like