Problem mit Script

[1unitedpower]

• Da das nur in Browsern funktioniert, die custom properties unterstützen (also nicht im IE ≤ 11), wird ebendies mit @supports() abgefragt und das Menü nur in modernen Browsern als Bienenwabe gestylt (progressive enhancement). Und da das Auf-/Zuklappen nur mit JavaScript funktioniert, erfolgt das Styling über den Attributsensor [data-javascript-enabled="true"] nur, wenn das JavaScript auch ausgeführt wird und dieses Attribut gesetzt wurde. Weil der Button ohne JavaScript keine Funktion hat, wird dieser erst mit JavaScript eingeblendet.

Was ist mit dem Fall, dass der Browser keine Custom-Properties unterstüzt, aber das JavaScript ausgeführt wird. Dann könnte man den Button erst nach einer Feature-Abfrage aktivieren:

button.hidden = !CSS.supports('--custom-property: 0')

Oder man verzichtet auf Custom-Properties und benutzt stattdessen einen Preprozessor, das spart die Feature-Abfrage in CSS und in JavaScript und man dürfte damit noch ältere Browser erreichen.