Fragen zum CSS-Flyout-Menü

[Gunnar Bittersmann]

@@Gunnar Bittersmann

Verwende die ebenfalls auf der Seite beschriebene Umsetzung mit Toggle-Button.

Aber nicht unbedingt so, wie im Wiki beschrieben. Die dortige Umsetzung ist nicht DRY (don’t repeat yourself), sondern WET (write everything twice). Sie verwendet zwei Dinge, die exakt dasselbe tun: den Zustand des Buttons anzuzeigen.

• das class-Attribut is-active wird gesetzt bzw. gelöscht
• das aria-expanded-Attribut wechselt zwischen "true" und "false"

Das ist unsinning; eins genügt. Und das Eine ist das aria-expanded-Attribut.

Anstatt des Klassenselektors .is-active – der in CSS auch nur eine verkürzte Schreibweise des Attributselektors [class~="is-active"] ist – lässt sich zum Stylen der Attributselektor [aria-expanded="true"] verwenden.

🖖 Живіть довго і процвітайте