Das Akkordeon Bric bietet eine Möglichkeit, zwischen dem Ausblenden und Anzeigen großer Mengen von Inhalten aufzuschlüsseln. Akkordeons bestehen aus verschiedenen Unterelementen wie dem Karte Bric und Div Container Bric, wodurch sie einfach angepasst und unabhängig gestaltet werden können.
Um weitere Akkordeonabschnitte hinzuzufügen, wählen Sie einfach eine der Karten (im Haupt-Akkordeon-Div-Container) über den Ebenenbaum aus und duplizieren Sie sie über die Tastenkombination D.
Struktur
Die Struktur eines Akkordeons ist etwas komplexer als die meisten anderen Brics innerhalb gefunden Blocs. Es besteht aus a Div Container Bric das hat seine Art auf ein setzen Akkordeonbehälter und sein ID Stellen Sie beispielsweise einen eindeutigen Wert ein Akkordeon-17605. Innerhalb dieses Containers gibt es mehrere Karte Brics. Jede Karte Bric hat eine Link Bric innerhalb des Kartenkopfabschnitts und eines zusätzlichen Div Behälter, der den Kartenkörperabschnitt enthält.
Kommunikation
Das Akkordeon Bric Funktionen werden über die gesteuert Link Bric (im Kopfbereich einer Karte zu finden) und die Div Behälter (der den Kartenkörperabschnitt enthält). Beide Artikel haben benutzerdefinierte Datenattribute angewendet auf sie, um ihnen die typische Akkordeonfunktionalität zu geben und ihnen zu ermöglichen, miteinander zu kommunizieren.
Akkordeon Link Bric
Der Link ist das Element, auf das Sie klicken, um den Akkordeonabschnitt anzuzeigen. Dieser Gegenstand hat eine spezielle Einrichtung, die es ihm ermöglicht, als Teil eines Akkordeons zu arbeiten. Es hat seine Interaktion einstellen keine und es hat auch verschiedene benutzerdefinierte Datenattribute, von denen die wichtigsten zwei die sind Datenziel und Arienkontrollen.
Datenattribute verknüpfen
Das Datenziel Das Attribut hat beispielsweise einen Wert, der auf eine eindeutige Referenz festgelegt ist # Akkordeon-17605-Artikel-1dem „Vermischten Geschmack“. Seine Arienkontrollen Das Attribut enthält einen nahezu identischen Wert wie das Datenziel Attribut, aber das # am Anfang wurde zum Beispiel entfernt Akkordeon-17605-Artikel-1. Diese eindeutigen Referenzen sollten mit dem übereinstimmen ID des entsprechenden div-Containers, in dem der Kartenkörper verschachtelt ist.
Akkordeon Div Container
Innerhalb jeder Karte Bric (im Akkordeon Hauptbehälter gefunden) ist eine zusätzliche Div Behälter, der seine hat ID Stellen Sie beispielsweise einen eindeutigen Wert ein Akkordeon-17605-Artikel-1. Dieser ID-Wert sollte den benutzerdefinierten Datenattributen entsprechen und mit diesen übereinstimmen. Datenziel und Arienkontrollen auf dem Link gefunden Bric (befindet sich im Kartenkopfbereich).
Dieser div Container Bric enthält auch verschiedene benutzerdefinierte Datenattribute, von denen das wichtigste ist Daten-Eltern. Dieser Wert dieses Datenattributs sollte mit dem übereinstimmen ID zum Beispiel des Hauptakkordeonbehälters # Akkordeon-17605. Dieses Datenattribut teilt dem Browser mit, auf welchen Akkordeoncontainer sich dieser Abschnitt bezieht.
Wenn Sie Änderungen an den Akkordeon-Link-Datenattributen vornehmen Datenziel or ArienkontrollenAchten Sie darauf, die zu aktualisieren ID für den entsprechenden div-Container (der den Kartenkörperabschnitt enthält) und umgekehrt.
Weitere Informationen zur Funktionsweise von Akkordeons finden Sie in der Bootstrap 4-Dokumente.