<% include ../../header %> <% locals.message = 'the above lazyloaded after a one second timeout
lazyload images example "appearlazy"
all images from simpledesktops.com - scroll down'; locals.delay = 'data-delay="1000" data-'; %> <% include ../../cover %>

these images lazy loaded individually

the images in this parent container are loaded all at once

appearlazy

appearlazy uses appear.js to lazy load images or divs that have an "appear" class. It works by switching a data-src attribute into the src as an image is identified as viewable.

Background images can be configured with a data-bkg attribute.

When applied to a div, appearlazy will search for elements within it with the right data-attribute or if none are found, on the div itself.

Images can also be lazy loaded on a simple timeout, using the data-delay attribute.


<%- js.appearlazy %>

"appeared" images can be fade transitioned into view using the following css

<%- css.appearlazy %>

Download

source or minified