window.onload = rolloverInit;

// Changes image on mouseover
// To use this function:
//      the image should have class 'rolloverimage'
//      the file ending should be no more than 4 characters
//      if the first image is called, eg, 'name.jpg' then the
//          new image should be 'name2.jpg'

function rolloverInit() {
	for (var i=0; i<document.images.length; i++) {
		if (document.images[i].className == "rolloverimage") {
			setupRollover(document.images[i]);
		}
	}
}


function setupRollover(thisImage) {
	thisImage.outImage = new Image();
	thisImage.outImage.src = thisImage.src;
	thisImage.onmouseout = rollOut;

	// Get image source, removing file ending
	index=thisImage.src.lastIndexOf('.');
	rolloverimg=thisImage.src.substring(0,index);
	fileend=thisImage.src.substr(index,5);

	thisImage.overImage = new Image();
	thisImage.overImage.src = rolloverimg+"2"+fileend;
	thisImage.onmouseover = rollOver;	
}

function rollOver() {
	this.src = this.overImage.src;
}

function rollOut() {
	this.src = this.outImage.src;
}