CSS: Menue per Klick auf ein image aufklappen

[JürgenB]

Hallo Gunnar,

Das ist mit CSS allein nicht möglich. Du kannst dich gern unter https://wiki.selfhtml.org/wiki/JavaScript/Tutorials/zugängliche_Dropdown-Navigation umschauen.

und wenn es nur um das Auf- und Zuklappen geht, reicht schon details/summary.

Nö. Das hat bei Tastaturbedienung zwei Fehler:

• Das Menü schließt nicht bei [Esc].

das würde ich nicht als Fehler ansehen. Man kann das Menü bedienen. Für mich eher ein Komfortmerkmal. Ist aber im Tutorial drin.

• Man bleibt nach dem letzen Menüpunkt nicht im Menü (focus trap) und gelangt zum ersten Menüpunkt, sondern springt raus

Das sehe ich auch nicht als Fehler an, da die Bedienung möglich ist. Ich habe mich im Tutorial bewusst dagegen entschieden. Ich möchte das Menü mit Tab auf den letzten Punkt verlassen. So kenne ich es.

Javascript wird wegen der absoluten Positionierung für IEs und MS-Edge benötigt, und für ein wenig Komfort.

Auch um die o.g. Fehler zu beheben, bedarf es JavaScript.

Wenn denn details/summary überhaupt geeignet ist.

Warum nicht? Warum soll es besser sein, einen Button mit role- und Aria-Attributen umzumodeln. details/summary wurde dafür gemacht, etwas auf und zu zu klappen.

Das sollte schon mal in die richtige Richtung gehen: off-canvas menu, with focus trap

Funktioniert im MacOS-Safari nicht. Bei Klick auf Menü wird nur das Hamburger-Icon durch ein „X“ ersetzt, das Menü klappt aber nicht auf. Dafür kann der Text nicht mehr gescrollt werden.

Gruß
Jürgen