Akkordeon

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 . Div Container Bric, wodurch sie einfach angepasst und unabhängig gestaltet werden können.

Hinzufügen weiterer Abschnitte

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 Typ 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.

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 . Arienkontrollen.

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 . 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.

Anfängertipp

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.

Aktualisiert am 3. Dezember 2018

War dieser Artikel hilfreich?

Verwandte Artikel