Mamy układ siatki dla Galerii. Niestety jego ładowanie jest nieco gwałtowne i chwiejne. Dzieje się tak, ponieważ kolumny CSS3 są zaprojektowane tak, aby równomiernie rozdzielać zawartość między każdą z nich, ale czasami ładowanie obrazów zajmuje trochę czasu i nie ma jeszcze szerokości / wysokości do użycia. Kiedy więc pojawiają się, kolumny muszą się zreorganizować.
Myślę, że możemy temu zapobiec za pomocą JavaScript. Ponieważ znamy wysokość i szerokość obrazów, możemy utworzyć ramkę o odpowiednim współczynniku proporcji i umieścić w nim jako element zastępczy. Następnie po załadowaniu obrazu zastąpimy symbol zastępczy obrazem.
Pod koniec filmu jesteśmy na dobrej drodze, ale jest trochę zepsuty. Nie martw się, naprawimy to w następnym filmie.