Printable View
I've created a menu icon which has a mouseover set to reveal a pop-up layer. On the popup layer, I've inserted a vertical navbar. This works fine. However, some of the navbar items have sub-menus. Those sub-menus display as expected, but when the mouse cursor is moved over the sub-menus, the pop-up layer hides, so the menu disappears. How can I make the popup layer stay visible whilst the user is interacting with the menu items?
I'd still like to know how to fix this, but for now, I've found a way around it by making it pop-up as a link rather than just a pop-up layer...
You shouldn't have asked!
Just to check - is your NavBar sitting in the pop-up Base layer and another "MouseOver "+ Base layer? Base is the name of the layer pair.
If not, the NavBar is in its default MouseOff and MouseOver layers so any activity with its sub-menus automatically moves focus from the roll-over layer back to the default pair and so closes the pop-up layer. (See Help > Search: Layers, Mouseover (Rollover) & Pop-ups)
Having done what I have described, I then tried variations of closing automatically on roll-over and click.
Nothing worked.
I reverted to my usually approach of creating a CSS3 NavBar.
Sorry, on Xara's behalf,
Acorn
I think you can accomplish this using layers, but it gets out of control very quickly.
Create individual buttons instead of a Navigation Bar. Use standard click links to go to pages and Web Animation > Show Pop-up Layer to link to the sub-menus.
You need a new layer for each sub menu and a separate MouseOver layer for each sub menu. For example, Menu-1, MouseOver-1, Menu-2, MouseOver-2,
OK, here's a quick example.
On the links to Page 2 and Page 3, which have links to additional sub menus, the MouseOver button goes on the actual menu layer instead of the MouseOver layer. The MouseOff version links via web animation to the Menu Layer and the button that appears on the Menu Layer links to the page.
As I said this is very convoluted and in my case, brain numbing. But it can work and the advantage is you can control the design of the individual buttons as well as the fly out menu buttons.
Many thanks, both.
This does seem to be possible with layers, but it's certainly complicated! I think I could probably get it working, but trying to edit it in the future is going to be a nightmare! It's a shame that Xara WD's navigation bars won't work properly on pop-up layers. I really liked WD when I first started using it, but as I'm building sites with it, I'm starting to see a lot of rough edges. :-(
Weird thing is, I actually got the navigation bar to work as I wanted - placed in a "Menu" layer, and with hover properties in "MouseOver Menu". It looked perfect - just as I wanted it, and when previewed and displayed in a browser, hovering over links in both the main menu and submenus showed the correct address in the status bar. Clicking links on the main menu worked as expected (i.e. it took you to the page at the link), but the submenu items don't work: clicking them just closes the menu. Right-clicking and "open in new tab" works fine... No idea why this would be?