Flyout Header

Navigationslinks mit children[] zeigen ein Dropdown-Panel. Desktop: öffnet beim Hover/Fokus. Mobil: öffnet beim Klick. Vollständig tastaturzugänglich mit aria-expanded, aria-haspopupund Escape-Taste zum Schließen.

Live-Demo mit Mock-Daten

Der folgende Header verwendet hartcodierte NavItems mit children[]. Hover über „Produkte" oder „Dienste", um die Flyout-Panels zu sehen.

Tastaturzugänglichkeit

Eigenschaften