Rolf B: Formatierung bei verschachtelten Listen zum Aufklappen (Wiki-Artikel „Akkordeon mit details“)

Beitrag lesen

problematische Seite

Hallo Anja,

ich möchte Dich gerne auf einen Artikel von Heydon Pickering verweisen: „Collapsible Sections“:

https://inclusive-components.design/collapsible-sections/

Leider englisch, und leider keine geschachtelten Sektionen. Aber dort wird intensiv die Bedienbarkeit einer solchen Liste diskutiert. Er verwendet nicht <details>, sondern implementiert die Ausklappfunktion selbst.

@Gunnar Bittersmann: Was meinst Du, warum Heydon auf <details> verzichtet hat? Fand er es unpassend für die Aufgabe, oder lag es an der Kompatibilität? Der Artikel ist von 2017, laut caniuse.com fehlte <details> da „nur“ im Edge-Browser, der bekam es erst 2020 mit der Umstellung auf Chromium. Im Firefox kam es 2016.

Mit <details>, Heydons Idee eines SVG-Elements für den Expand-Marker und einer Rotation beim Aufklappen könnte es so aussehen:

https://jsfiddle.net/Rolf_b/mLb8dyoq/

Rolf

--
sumpsi - posui - obstruxi