I am using the Glint template, and I have found a problem with its Masonry plugin.
When you have a lot of Masonry thumbnails, the images will have difficulty loading when scrolling down the page. You can see this problem here: Glint
Once you scroll past the first 10 images, the new images will struggle to load in. I don’t know if this is a problem with the Masonry or Animate on Scroll plugin, but it might be either of those. The only temporary fix I found was to resize the browser window, which forces the rest of the images to load properly as you scroll down.
This should be a simple problem to fix. I would appreciate any help.
I was not able to reproduce this problem on my side, our demo is also not showing such a problem, can you please try it on the real server? the menu is also not working here because of som JS error
The menu issue was just a small mistake. I have restored the template back to default, and the only thing I’ve done is duplicate the Masonry Bricks to show a lot of photos.
The issue definitely occurs for me and others. If the images load properly for you, refresh the page and scroll from the top again. The images should load slowly and eventually struggle to load.
To my knowledge, this is an issue with AOS (Animate on Scroll). If I remove AOS on an image, it will load perfectly without an animation. This means that Masonry is working, but AOS does not.
This might be fixed by adjusting the JS settings for AOS.
You can tell your developer that the WOW.js library works for this Glint template. All you need to do is add animate.css and wow.js. Then remove the data-aos=“fade-up” attribute from your elements and place wow animate__animated animate__fadeInUp inside of <class>.
This obviously doesn’t fix the issue with the template’s Animate on Scroll library, but it’s a good, easy alternative.
