dojox.image

Project owner:Peter Higgins
since:V1.2

The DojoX Image project provides a number of image-related widgets as extensions to Dijit, such as a Lightbox, SlideShow, FlickrBadge, among others. The goal is to provide a common way of handling images, though some Image project widgets are designed for edge-cases, like the Magnifier.

Most widgets within this project are experimental.

Core API

Prior to Dojo 1.3, no "core API" was provided. Newer versions include helper functions, available by loading the dojox.image module:

dojo.require("dojox.image");

Preloading Images

When setting an image to a new src="" attribute, if the image has not been cached by the browser, there will be a delay before the new image is seen. This can be significant if the images are large or the connection is slow. In DojoX Image package, a function preload is provided to load these images off-screen. It is a very simple function, and does not do any notification about image readiness. All browsers treat a unique image url as one, so the image will be already loading if someone attempts to view image you are preloading.

Just pass an array of url's to the function:

// must be after dom ready:
dojo.require("dojox.image");
dojo.ready(function(){
    dojox.image.preload(["pic.png", "face.jpg", "http://example.com/logo.gif"]);
});

Alternately, you can specify a list of url's as an array to a dojoConfig parameter before dojo.js is loaded with the preloadImages option:

var dojoConfig = {
    preloadImages:["foo.jpg", "bar.png"]
}

Additional Components

There are several additional widgets available in the project. Each has it's own requirements and usage: