Układanie elementów na siatce Opcje

[lustfingers]

Witam, mam dodatek którym ładuje zdjęcia, są one układane na siatce, to dział ładnie do momentu jak wrzucę zdjęcie które w wysokości zajmuje więcej niż jedno pole wtedy pozostaje pusta przestrzeń którą chciałbym wypełnić kolejnym elementem.

Poniżej grafika która to zobrazuje, każdy element ma długość 25% strony czyli jedno pole siatki i float:left. Białe pola są puste i chciałbym je wypełnić, ktoś może mi podpowiedzieć jak to zrobić?

(IMG:http://i.imgur.com/Qm79iqd.jpg)

[lustfingers]

No właśnie w tym chyba jest największy problem ponieważ robię to na prestashop, jest już sporo bibliotek załadowanych i dodając jquery sypie mi w konsoli błędami. Najlepiej jakbym wiedział które funkcje z plików są za to odpowiedzialne wtedy było by mi może łatwiej poskładać to w sensowną całość bez zbędnych funkcji. Druga sprawa jest taka że mam układ html zupełnie inny niż w przykładzie i to też za pewne wymaga zmiany w js.


EDYCJA:

Utworzyłem jsfiddle który obrazuje uproszczony przykład. Teraz chcę wykonać taką modyfikacje która pozwoli wypełnić pustą przestrzeń poniżej diva 1 np. divem 5, dziurę po 5 wypełnić divem 6 i kolejno divem 9.

https://jsfiddle.net/dLnwfr56/

Czy podanym przykładem jestem to w stanie zrobić?

Podbijam temat.

Ten post edytował lustfingers 27.06.2016, 18:43:42