// Next, declare one or more 'PhotoMorpher' objects; I'm creating one called "photo".
// PARAMETERS:
//  1) Its own name (e.g. 'photo').
//  2) The ID of the area that will contain the images (e.g. 'photoArea').
//  3) The ID of the list that links to the images (e.g. 'photoList').
//  4) The CSS classname to apply to active items in the list (e.g. 'photoItemActive').
//  5) Other CSS classnames to apply to page elements when the scripts initialises.
//     The format for this is { 'id':'classname', 'id2':'classname2' }.
//     See the .CSS file for the classnames, it should make sense then!
var photo = new PhotoMorpher('photo', 'page-header', 'photoList', 'photoItemActive',
 {'page-header':'page-header' , 'photoList':'photoListActive'}
);

// Here's some optional settings you might want to tweak...
photo.fadeSteps = 20;
photo.autoPlay = true;
photo.autoDelay = 3000;
//photo.autoPreload = false;

// That's all, the script will then automatically load itself when the page finishes loading!