Pop-up Menu Issue: It's hiding behind the header, help me make it STOP!

[Braden]

I hope this will well describe the issue.



I'm not sure if the Vintage Paper picture will embed into the Xara file, but just in case it doesn't, you can download it here:

https://pixabay.com/photos/vintage-t...retro-2714966/

[Chris M]

Make the pop-up menu items sticky.

Highlight the objects on the 'menu' layer, RIGHT click > Web Sticky/Stretchy.

Problem solved.

[Braden]

Indeed! I can see them now!

However, now the animation I set in the pop-up menu settings is not working.

Though it is set to Fade in Down, it opens instantly.

[Chris M]

You are correct, the animation stops working. Why have I never noticed this before?

This brings forth more questions. Has it always been the case? Why does this happen? Is there a work-around?

[Braden]

Hmmmmm... I have no answers for you!

Perhaps we are doing something wrong?

[Initiostar]

Braden,

I am not sure what you had in mind, but here is a well-proven way of creating a NavBar on a mobile menu layer. Add a MouseOver Menu layer, create a button across both the Menu and MouseOver Menu layers and use a standard Xara menu in a dropdown format (with if you like a transparent background on the menu layer).



On your main menu, I would have the mouseover at least show the button, rather than disappear.

The alternative is to create a mobile menu page and place menu buttons on that page (favoured by many on this forum) eg: https://omnidisplay.uk

If you take this route, your mobile menu page needs to transition to the desktop (should anyone ever try it) i.e as you drag a browser from a mobile width you need to see the desktop menu.

XAR doc attached for you to experiment with.

Gary

[cmpan1]

menu.xar


VIDEO


And BTW... you cannot change the animation in a 'popup layer'... when the object(s) are in the layer...
you have to temporarily move it out of the layer... make the change, then put it back.

Cliff

[Chris M]

You're right Cliff
The Transition Effect in the layer settings don't work if the layer is sticky.
You can't add a reveal animation to a layered object.
You CAN create the reveal animation on the Mouse Off layer and then copy it to the layer and it works!

Confusion, it's a state of mind.

[Initiostar]

@ Chris,

Why have the Mouse Over layer as there is no hover state with mobiles? Genuine question

For some sites, I have a mobile menu visible all the time on the MouseOff layer; the button that refers to the page you are on takes the MouseOver state. In this instance, it works on Android and ios. Were the menu to be on a popup layer, Android ignores the hover, but ios can highlight the mouseover (first click) and requires a second click to access the page.



My suggestion therefore to Braden should not have suggested buttons with a MouseOver state. Apologies too, as the answer did not address the specific question, but provided alternative ways to create a mobile menu (of which there are many).


@Chris & Cliff,

Liked the work-around for animation on the popup layer, understood how you did it, but when I tried to create links for any of the buttons, they worked as expected on the MouseOff layer, but did not work when I transferred them (copy and paste) back to the popup layer. What step in the process have a missed. Thanks.

Gary

[Chris M]

@ Chris,



For some sites, I have a mobile menu visible all the time on the MouseOff layer; the button that refers to the page you are on takes the MouseOver state. In this instance, it works on Android and ios. Were the menu to be on a popup layer, Android ignores the hover, but ios can highlight the mouseover (first click) and requires a second click to access the page.Gary

Ah ha. I understand now.

Cliff's work around is to not add a transition effect to the layer, but to add a reveal effect to the sub menu itself. This can only be done on the mouse off, not in the layer itself. Adding the effect and then cutting/copying to the layer allows it to work for some reason.