dk_masonry - Unterschiedlich breite Elemente

[FrischBlau]

Hallo,

ich habe jetzt auch endlich mal ein Projekt, bei dem ich dk_masonry einsetzen kann :-) Funktioniert soweit alles wunderbar. Eine Frage dazu: Gibt es in dk_masonry die Möglichkeit, so wie bei David DeSandro unterschiedlich breite Elemente zu verwenden? Hat da jemand Erfahrungen?

Danke & viele Grüße

[Kahmoon]

Ich habe es nicht geschafft. Hätte eine ähnliche Anforderung weil hier Querformatbilder somit immer viel kleiner als Bilder im Hochformat sind.

Bei diesen Beispielen (http://desandro.com/masonry) scheint das aber zu gehen (3. Beispiel "Erik Johanson").

[FrischBlau]

Hi Frank,

das Erik Johanson-Beispiel habe ich gesehen. Es gibt natürlich noch die Möglichkeit, mit dem Masonry-Original zu arbeiten und das irgendwie in das Galerie-Template reinzubasteln...schöner wär natülich, das direkt mit dk_masonry zu machen.

Schöne Seite übrigens!

Viele Grüße
Steffen

[Kahmoon]

Danke

Ja, fände ich auch schöner...aber Dirch hatte da glaube ich auch keine passende Lösung.
https://community.contao.org/de/show...breit-anzeigen

[Spooky]

Link zur Seite? Sollte auf jeden Fall möglich sein. Die Frage ist schlicht: was sind die exakten Anforderungen und wie exakt erwartest du dir, dass das Ergebnis aussehen soll? Im Endeffekt läuft es darauf hinaus, dass du dir ein Grid System überlegen musst, passend zu deinen Anforderungen.

[Dirch]

Das geht ganz einfach nur NICHT mit der Galerie, da man hier den Bildern leider keine Klassen mitgeben kann. Man müßte sich da erst an anderer Stelle etwas bauen.

Aber sonst geht es so:

Man nehme dazu den Start- und End-Wrapper und platziere seine Elemente darin. Dann vergibt man den Elementen eine CSS-Klasse in Abhängigkeit der Breite. Damit es harmonisch ausschaut sollten die größeren Elemente immer ein Vielfaches sein und auch die Höhen dazu passen. Also z.B. 1, 2, 4 oder 1, 3, 6. Das Masonry-Grid wird dabei auf die Breite des schmalsten Elements gesetzt. Wichtig aber auch dem kleinsten Element auch immer noch per CSS die Breite (zusätzlich) zu setzen.

Mehr ist es eigentlich nicht. Responsive geht dann am einfachsten über die indirekt vergebene Grid-Breite durch eine CSS-Klasse, die dann über media-qeries unterschiedlich gesetzt wird.

[FrischBlau]

Morgen Dirch,

danke für den Denkanstoss! Auf die Schnelle gleich mal die Wrapper-Lösung getestet und es funktioniert. Sehr schön! Muss das Ganze jetzt nur noch responsive machen. Was meinst Du mit einer indirekt vergebenen Grid-Breite? Die Elemente und und die Spaltenbreite haben jetzt Prozenzwerte, Media-Queries dazu und das Ganze ist responsive. bin begeistert.

Viele Grüße
Steffen