SirKnightDragoon / jquery-imageloader

jQuery.imageloader helps you to load images not on page load, and gives you call back when it's all done.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

jQuery.imageloader()

jQuery.imageloader() lets you have granular controls of image loading timing.

DEMO

beatak.github.com/jquery-imageloader/

EXAMPLE

$('.YOUR-SELECTOR').imageloader(OPTIONS)

OPTIONS

The instance option as follows:

Name Type Default Description
selector string (empty string) Selector for the elements that $.fn.imageloader() will look for in order to load the image. If the empty string is passed, $.fn.imageloader() will try to load the image on "this" object.
dataattr string "src" Data attribute for the elements that $.fn.imageloader() will look for. As default, $.fn.imageloader() will look for data-src attribute.
background boolean false true if you want to load image as background-image css.
each function null Callback function for each image is loaded. when you try to load one image, it doesn't make any difference from callback. See Demo
callback function null Callback function when the image is loaded. "this" is passed as the first argument. See Demo
timeout number 5000 Millisecond for loading timeout.
purge boolean true false if you don't want to removing DOM element in case of failing image loading

There is also a global option:

Name Type Default Description
$.imageloader.queueInterval number 17 A browser can only issue parallel HTTP requests 2 to 9 for each domain name as a default (according to Browserscope, May 2012). When you try to load massive numbers of images all at once, it can consume all browser's UI thread. So $.fn.imageloader() is using a time-domain queue for controling loading timing. 17 millisecond is a one frame delay under 60fps. As default, when you apply $.fn.imageloader() to numbers of elements, it will make <img> elements every 17 milliseconds.

CREDIT

© 2012 Takashi Mizohata.

Licensed under MIT.

Special thanks to Meetup

About

jQuery.imageloader helps you to load images not on page load, and gives you call back when it's all done.

License:MIT License


Languages

Language:JavaScript 100.0%