This is an enhancement of this page. It includes scroll-throttling (to reduce the number of eventCalls, as suggested here) and removes the event once all images have been loaded.

This example shows a pure JS (no jQuery or shit) function that loads the images only they are currently in the visible area of the window.

You can open your dev-tools and monitor how the requests are made gradually when you scroll.

Note 1: only vertical scrolling is monitored here.

Note 2: for rendering optimization, images start to load 500px under the visibility line and 50px above. You can edit this if you want to.

(Oh, and these images are rendered with Sebsauvages “webGobbler”.)