desandro / masonry

:love_hotel: Cascading grid layout plugin
https://masonry.desandro.com
16.41k stars 2.11k forks source link

not loading correctly, but it does some times, grr #1196

Open StuartClickReturn opened 6 months ago

StuartClickReturn commented 6 months ago

Hi there

My grid keeps loading with half the picture on top of one another, and cannot understand why? https://newtopia1.wpenginepowered.com/artwork/

when you resize the window the grid reconfigures perfectly, why can it not just load right the first time...

im confused where i have gone wrong it looks like this --> https://newtopia1.wpenginepowered.com/wp-content/uploads/2024/03/Screenshot-2024-03-18-at-23.18.23.png or this --> https://newtopia1.wpenginepowered.com/wp-content/uploads/2024/03/Screenshot-2024-03-18-at-23.03.36.png

help?

autoantwort commented 4 months ago

I have the same problem. Have you found a solution?

I guess the problem is that the layout is computed before the images are loaded and therefore the initial height that is not the final one is used.

Luckyfella73 commented 3 months ago

Providing the JS you use for setting up the masonry would be good.

Do you use imagesLoaded? That is the recommended way to make sure the images are loaded before doing the layout-math.

See documentation (scroll down to imagesLoaded section): https://masonry.desandro.com/layout

autoantwort commented 3 months ago

Yeah this was the problem/solution for me: https://masonry.desandro.com/layout#imagesloaded