Button zum Hinzufügen von Klassen

[Rolf B]

Hallo marctrix,

zunächst mal hätten wir eine business clarification phase zu absolvieren.

• sind compact-layout und compact-form gegenseitig ausschließend oder können sie gleichzeitig aktiv sein?
• sollen die Buttons Toggle-Buttons sein (d.h. ein klick schaltet ein, der andere aus), oder soll es Buttons zum einschalten und Buttons zum ausschalten geben?

dann gäbe es eine technical clarification phase:

• welche Art von JavaScript willst Du nutzen? (synchron/asynchron laden, module-Technik)
• gibt es Browser, bei denen sagt: "Zu alt, dafür biete ich das Feature nicht an"?

Danach hast Du drei Aufgaben zu lösen:

• Registrieren des click-Eventhandlers pro Button
• Schreiben des JS Code der auf die Klicks reagiert
• Erstellen der nötigen CSS Styles, die auf die class-Angabe am html Element reagieren. Es würde mich nämlich wundern, wenn irgendein Browser diese Angaben mit etwas anderem als einem Schulterzucken quittieren würde. Oder ist das tatsächlich ein undocumented feature von Browsern?

Unter Festlegung gewisser Annahmen habe ich mal rumgefiddelt.

Das Script, das ich da verfasst habe, prüft zu Beginn dem readyState des Dokuments und kommt deshalb mit jeder Script-Ladetechnik klar.

Als UI habe ich 3 Buttons verwendet, um die Zustände compact-layout, compact-form und regular zu schalten. Mittels CSS müsste man noch etwas bauen, das den aktiven Zustand im Button darstellt.

Rolf