JS_BRAMUS.lazierLoad, a Javascript Image Lazy Loader has been updated to version 0.3. Changes are compatibility with the latest Prototype version (1.6.0.2), the introduction of a global options object to easily configure lazierLoad and some extra options such as minWidth, minHeight and extensions.
What is lazierLoad?
lazierLoad is a little JavaScript wichh automatically hooks itself to the page, finds all images and only loads those appearing “above the fold” resulting in faster page loads as the images not located in the viewport, are not loaded until they appear within it (viz. when the user scrolls down).
The idea for lazierLoad was inspired upon Lazy Load (which is built for use with jQuery), yet the code differs quite a lot.
What is new in this version?
The most important change is that version 0.3 introduces compatibility with Prototype 1.6 final or higher, something 0.2 was not capable of due to a rather huge change in how events are named between rc1 and the final.
Next to this compatibility issue, lazierLoad now holds a global config Object named lazyLoadOptions. This variable can easily be altered to reflect the options you want to use it with. In version 0.3 some new options were introduced: minWidth, minHeight and extensions.
In version 0.3, the possible options to tweak are:
treshold: images which appear treshold pixels from the bottom will be loaded
(defaults to “100”)replaceImage: image to replace the non-loaded images with until they are loaded (most likely a transparent 1 by 1 pixel image)
(defaults to “blank.gif”)loadingImage: image to show while a non-loaded image is being loaded
(defaults to “spinner.gif”)extensions: array of extensions to lazyLoad
(defaults to “[‘gif’,’jpg’,’png’,’jpg’]”)minWidth: minimum width an image must have in order to be lazyLoaded
(defaults to “100”)minHeight: minimum height an image must have in order to be lazyLoaded
(defaults to “100”)
Cool, is there a demo?
TIP: scroll down really really fast 😉
Where can I download it?
Right here:
Wow, you’re going to fast: I have a question, I need help, I need more info, how do I configure this thing?
Don’t worry my friend, there’s a full page here on bram.us devoted to lazierLoad where you can find all info about it.