- MooTools -
- May 17th, 2009,
- 4 Responses
MooImagePreload
- 17 May
There's nothing more ugly than a picture of a loading image (pixel by pixel). How about just fading it in, when then image is fully loaded?
Here we go, just add this little piece of code to your website and set the scope of the images you want to preload and fade in. Plus, if there’s an error while loading a specific image you can simply display a pre-set one by using the noImage option.
You can use the selector scope to load all or a certain group of images, ie. img.preload, img[rel=preload], etc.
Possible options
1.0
- noImage: image URL to use when an error occurs (404, broken lit, etc).
new MooImagePreload('#wrapper img', { noImage: '404-image.gif' });
Plus some initial style:
img {visibility: hidden}
- Examples
- Get MooImagePreload-1.0.js (2Kb)
- Requires mootools-1.2.2-core.js and mootools-1.2.2.1-more.js or newer