menuitem-anchor-positioning-ref.html

Enable keyboard shortcuts

<!DOCTYPE html>

<link rel=stylesheet href=resources/menu-elements-styles.css>

<div class=menubar>

  <div class=menuitem>Nothing</div>

  <button class=menuitem id=trigger popovertarget=top-menulist>Trigger</button>

</div>

<div popover class="menulist menulist-with-menubar-anchor" id=top-menulist>

  <button class="menuitem expand-icon" id=trigger2 popovertarget=sub-menulist>Trigger 2</button>

  <button class="menuitem expand-icon" id=trigger3 popovertarget=sub-menulist2>Trigger 3</button>

</div>

<div popover class="menulist menulist-with-menulist-anchor" id=sub-menulist>

  <div class=menuitem>Most nested item</div>

</div>

<div popover class="menulist menulist-with-menulist-anchor" id=sub-menulist2>

  <div class=menuitem>Most nested item 2</div>

</div>

<script>

  trigger.click();

  trigger2.click();

</script>