5.2 – Klick oder Hover

trigger

options:
  variant: dropdown
  trigger: hover   # click (Vorgabe) | hover
  folderClick: link

Gilt für dropdown, mega und flyout.

click öffnet ein Menü beim Klick auf seinen Ordner. Das funktioniert überall und auch ohne Skript.

hover öffnet es beim Überfahren und — damit Tastaturnutzer nicht außen vor bleiben — auch, sobald ein Eintrag darin den Fokus bekommt. Beim Verlassen schließt es nach einer kurzen Verzögerung, damit ein Menü nicht zuklappt, wenn die Maus eine Ecke abkürzt.

Hover gibt es nur auf Geräten, die ihn können. Auf einem Smartphone oder Tablet gilt automatisch click.

hover gehört zu folderClick: link

Mit toggle klappt ein Klick das Menü, das beim Überfahren schon offen war, gleich wieder zu. Mit link öffnet das Überfahren das Menü, und der Klick führt auf die Ordnerseite — so erwartet man es von einer Menüleiste.

Wie Menüs schließen

• Ein anderes öffnen schließt das offene auf derselben Ebene.
• Klick daneben schließt alle Menüs dieser Navigation.
• Escape schließt alle und setzt den Fokus zurück auf den Ordner, aus dessen Menü er kam.
• Seitenwechsel schließt alle, bevor die neue Seite erscheint.

Wohin ein Panel ausweicht

Das Skript prüft beim Öffnen, ob ein Panel Platz hat.

flyout in der rechten Hälfte. Mit flyout.side: auto öffnen die Panels nach links, wenn die Navigation in der rechten Hälfte des Fensters steht — sonst ragten sie hinaus. Der Pfeil zeigt dann nach links. right und left schalten die Prüfung ab.

dropdown und mega am rechten Rand. Ein Menü, das rechts aus dem Fenster ragen würde, hängt statt an der linken an der rechten Kante seines Eintrags.

In einer Spalte, die abschneidet. Rollt die Seitenspalte für sich, oder blendet sie unten weich aus, würde sie ein Panel abschneiden. Das Panel wird dann aus der Spalte gehoben — in die oberste Ebene des Browsers, in älteren Browsern mit fester Position — und an seiner Zeile verankert. Weil eine so verankerte Position beim Rollen nicht mitwandert, schließt es sich, sobald gerollt wird.