want to load first image then display remaining image while scrolling

[gt06]

Thanks for the great plugin.

I have integrated this plugin into Magento project. On each category, there are 1000 product. Out of that, I have show only 24 products.

When i access the page, all 24 products images displaying at a time.so it takes too much time to load.

Instead I want to display first 8 images and then will display according to scroll.

I have created jsfiddle.

https://jsfiddle.net/3escsmsg/7/

When I set height to auto, scroll event does not work. When I set height: 500px or specific value, it works. But i don't want to set height to specific value.

How can i achieve image load on scroll.