Popover
Ein Popover Element ermöglicht das Konfigurieren von Maskenabschnitten, welche zu einem gewünschten Zeitpunkt in einer Popover-Blase dargestellt werden. Das Popover kann sich dabei an einem beliebigen anderen Element ausrichten.
Beispieldarstellung eines Popover Containers
Bild: Beim Klick auf den Namen des Reisenden, wird ein frei konfiguriertes Popover dargestellt, welches mehr Details zum Reisenden zeigt.
Konfiguration
Im Editiermodus wird das Popover immer stellvertretend von einem Platzhalterelement (A) repräsentiert. Beim Klicken wird das Popover dargestellt/versteckt und kann wie ein gewöhnlicher Elementcontainer konfiguriert und mit Elementen bestückt werden (B).
Wird die Form im Testmodus oder Livebetrieb ausgeführt, ist das Platzhalterelement (A) verborgen und das Popover wird am verknüpften Element (1) ausgerichtet.
Die Sichtbarkeit des Popovers wird über die Sichtbarkeit des Popoverelements gesteuert (Aktionen: Element anzeigen / Element verbergen).
An welcher Position (relativ zum verknüpften Element) das Popover erscheint, kann über die Eigenschaft "Position" (2) beeinflusst werden. Hat das Popover jedoch nicht genügend Platz, wird es an der nächstbesten Position dargestellt.
Tipp: Mit der Aktion Popover ausrichten können sowohl Elementzuweisung als auch Position entsprechend dynamisch definiert werden.
(3) Im Formularstil darstellen - Entscheidet darüber, ob das Popover im Standard-Tooltip- oder im Formularstil dargestellt wird
(4) Beim "Herausklicken" schließen - Legt fest, ob das Popover automatisch versteckt werden soll, wenn der Benutzer außerhalb der Popoverblase klickt
(5) Pfeil darstellen - Blendet den Pfeil des Popovers ein oder aus
Positionen
auto
Das Popover wählt seine Position automatisch aus.
links, oben, rechts, unten
Es wird versucht, das Popover entsprechend neben dem Element zu platzieren.
zentriert
Richtet das Popover zentriert auf dem verknüpften Element aus. Empfiehlt sich in Verwendung mit Layoutcontainern.
Layout: Sondereigenschaft "Popover CSS-Klasse"
Für ein Popover Element, steht in der Layoutkategorie die Eigenschaft "Popover CSS-Klasse" zur Verfügung. Dieser wert wird direkt in das Popover Element im DOM synchronisiert.
Die Standardeigenschaft "CSS-Klasse" wird hingegen wie gewohnt auf den Inhaltcontainer des Popovers gesetzt.