Accordeon
Das Accordeon-Element ermöglicht die strukturierte Darstellung größerer Inhaltsmengen innerhalb eines kompakten Benutzerinterfaces. Inhalte werden zunächst platzsparend dargestellt und können bei Bedarf durch den Benutzer ein- oder ausgeklappt werden. Typische Einsatzbereiche sind FAQ-Bereiche, Dokumentationen, Einstellungsdialoge, Hilfeseiten oder umfangreiche Inhaltsabschnitte, bei denen die Übersichtlichkeit im Vordergrund steht.
Die Umwandlung erfolgt automatisch über die Helper Funktion. Dabei werden die bereitgestellten HTML-Strukturen verarbeitet, ohne den eigentlichen Inhalt zu verändern. Vorhandene HTML-Elemente, Attribute und Event-Listener bleiben vollständig erhalten und können weiterhin wie gewohnt verwendet werden. Über das Attribut active lassen sich einzelne Bereiche bereits beim Laden der Seite geöffnet darstellen. Mehrere Accordeon-Gruppen können unabhängig voneinander innerhalb derselben Anwendung verwendet werden.
Einbindung
<accordeon-item active>
Lorem ipsum dolor sit amet
Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt
ut labore et dolore magna aliquyam erat, sed diam voluptua.
Beispiel
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr.