Home Privacy
Date : 7th December 2023

For all the latest browsers

INFORMATION

This demo is available on Firefox from version 114 by enabling the 'dom.element.popover.enabled' preference (needs to be set to true) flag in about:config. See mdn web docs Using the Popover API

This is a simple nested menu that can be opened and closed by a click/tap on menu items preceded by the ⮟ and ⮝ characters.

Click/tap the hamburger menu icon at the top left of the screen.

Click/tap an open branch to close all later sub menus in that branch, and click/tap anywhere outside the menu structure to close all open levels.

All this is achieved using buttons and popovers with no javascript/jQuery, radio or checkbox inputs.

The CSS is simple and will be even simpler when all browsers have the 'anchor' style available. At the moment the sub menu items need to be manually placed from the top level button, but 'anchor' will allow you to place all sub menus relative to their buttons

Please consider making a donation, every little helps.