Open kenjibailly opened 7 months ago
Hi,
I saw your issue with Infinite Scroll and Masonry. A couple of things to try: First, ensure imagesLoaded is really waiting for all images to load before Masonry arranges them. Adding a delay, like setTimeout, before initializing Masonry might help. After each Infinite Scroll load, it's important to call msnry.appended(items) to let Masonry know about the new items. Also, double-check your CSS against the demo. Subtle differences, especially in dimensions and positioning, can throw off the layout.
EDIT:
I found a vanilla JS demo that was linked somewhere here: https://codepen.io/desandro/pen/XgRpNr I'm experiencing a bug sometimes. I'm pretty much using the same code:
I'm using the exact same CSS code from the codepen. However sometimes the images are stacking on top of each other like this:![image](https://github.com/metafizzy/infinite-scroll/assets/9883910/7137f21e-c1e1-4a89-a484-2971d36719ec)
It doesn't happen every time, but enough to make it not stable enough. I'm wondering what's going wrong, can someone help me out here?
This is the html (hbs) I'm using: