Bräuchte mal eine Idee wie ich das umsetzen kann

**Membaris** · 23.07.2015, 16:18

Hat jemand eine Idee wie das Layout aus dem Screenshot umsetzen könnte. Ich spiele gerade mit dem hier https://ed-lea.github.io/jquery-collagePlus/ rum aber bei mir siehts das nie so sauber aus entweder ist der Rand links "franzig" oder unten ... Erreichen möchte ich das die Bilder sich selbst in einem Rechteck anordnen , dazwischen aber keine unterschiedlichen Abstände sind.

http://blogs.adobe.com/photoshopdotc...2/08/revel.png

**Kahmoon** · 23.07.2015, 16:26

dk_masonry :-)

**Membaris** · 23.07.2015, 16:34

Hmm du bist fix

Danke dir

Nur wie setzte ich das Teil jetzt ein ? Habs installiert und bin am Suchen

**Kahmoon** · 23.07.2015, 16:35

Anleitung lesen! :-)

Das erweitert quasi nur das bestehende Galerieelement und hat kein eigenes Inhaltselement.

Masonry platziert die enthaltenen Elemente anhand ihrer Größe und des zur Verfügung stehenden Platzes optimal.

Masonry ist ein JavaScript-Plugin von David DeSandro, das ein intelligentes Grid Layout implementiert. Masonry, aus dem Englischen für Mauerwerk, platziert die enthaltenen Elemente anhand ihrer Größe und des zur Verfügung stehenden vertikalen Platzes optimal verzahnt/versetzt wie ein Mauerwerk.
Nach der Installation dieser Erweiterung stehen innerhalb von Contao zusätzliche Inhaltselemente zur Verfügung:

Masonry - Galerie analog der Contao Galerie erweitert um die neue Funktionalität
und die beiden Wrapper Elemente Masonry - Umschlag Anfang sowie Masonry - Umschlag Ende um beliebige Elemente im Grid platzieren zu können

Möglichkeiten der Erweiterung und von Masonry

Konfiguration der Spaltenbreite als fester Wert oder indirekt über eine anzugebene CSS-Klasse
Konfiguration der Breite des Spaltenzwischenraums als fester Wert oder indirekt über eine anzugebene CSS-Klasse
Horizontale Ausrichtung (links/rechts) von wo aus mit der Platzierung der Elemente begonnen wird
Vertikale Ausrichtung (oben/unten) von wo aus mit der Platzierung der Elemente begonnen wird
verschiedene Themes

Tipps/Hinweise

Damit Masonry gestartet wird, muß im Seitenlayout jQuery zum Layout hinzugefügt werden.
Die Elementbreiten sollten per CSS definiert werden und zwar unabhängig der Einstellung der Spaltenbreite - selbst wenn diese gleich sind. Unterläßt man es, kann dies unter Umständen zu Layout-Fehlern führen.