This is a demo site that demonstrates the flexibility of the Dottoro Popup Menu feature.
Use the blue buttons above for site navigation, the other menus are for demonstration purposes only.
On this page you will find examples of standard popup menus. In this context, "standard" means you don't need to write any CSS, the theme options and the theme editor provide sufficient flexibility to accomplish them.
Menu in the header
The menu on the header is horizontally oriented, the first level popup menus open downwards while the others open rightwards. When there is not enough space for a popup menu to open, the theme tries to move it into the view. Resize your browser window in both horizontally and vertically. and you will see how it works. As you can see, when there isn't enough space for the menu, a compressed menu is displayed instead of the normal menu. The theme allows you to specify a width of the browser window below the compressed menu should be shown. Compressed menus can be created automatically and it is also possible to select different menus for the normal and compressed states.
Menu in the sidebar - same menu, different look
If you take a look at the sidebar, you will see the same menu as in the header, but it has a different look, its orientation is vertical and the first level popup menus open rightwards.
Menu in the content - same menu, click to activate
Finally, if you take a look at the bottom of the content, you will see the menu as in the header, but clicking is needed to activate it and the first level popup menus open upwards. The "click to activate" feature makes it possible to avoid accidental opening of the menu when the mouse hovers over it, thereby enhancing the end-user experience.