Wie erstelle ich dynamisch eine Collage (Raster ohne Lücken) von Bildern, in denen Bilder unterschiedliche Höhen haben?

8

Ich möchte eine Seite mit Miniaturansichten anzeigen. Die Thumbnails sind vom Benutzer hochgeladene Grafiken. Jedes Bild hat eine beschränkte Breite, aber keine beschränkte Höhe, um das vollständige Bild ohne Beschneidung anzuzeigen.

Ich möchte, dass die Bilder ohne Zwischenräume aneinander stoßen. Die Anzahl der Spalten ist nicht festgelegt: Wenn ich die Seite expandiere oder die Größe verändere, sollten die Bilder in die richtige Anzahl von Spalten fließen.

%Vor%

ist FAST, was ich will. Außer wenn es große Bilder auf der Seite gibt, sehe ich diese Lücke:

Wie beseitige ich die Lücken?

    
Homan 30.06.2011, 21:04
quelle

2 Antworten

6

Wenn Sie dies nur in CSS tun wollen, müssen Sie divs für jede Spalte erstellen und diese Spalten schweben lassen (aber es wird die Reihenfolge der Bilder durcheinander gebracht).

Alternativ können Sie das jquery-Plugin wie dieses verwenden.

    
Litek 30.06.2011, 21:18
quelle
9

Nicht sicher, wie anmutig Sie Ihr CSS brauchen, aber trotzdem eine gute Option. Sie könnten mauerwerk.js verwenden, um das zu unterstützen.

Ссылка

    
onefastsnail 25.02.2012 13:20
quelle

Tags und Links

Django: Verwenden von Annotate, Count und Distinct in einem Queryset So verwenden Sie den verbundenen Speicherzugriff