//rollover images function:
//usage: <a href="..." onmouseover="swapImg(this,document.getElementById('imageName'));"><img src="..." id="imageName"/></a>

// Just name the normal state as "filename.png" (or whatever) and rollover state as "filename_over.png"

function swapImg(anch,img) {
	var src = img.src;
	var newSrc = src;

	if(src.indexOf("-on.")<0) {
		//if not already in hover state, change to hover image:
		var dotIdx = src.lastIndexOf("."); //index of last dot in path
		var parts = [src.substring(0,dotIdx), src.substring(dotIdx)];
		newSrc = parts.join("-on");
	} else {
		//change back to original:
		var parts = src.split("-on.");
		newSrc = parts.join(".");
	}
	img.src = newSrc || src;

	//make onmouseout swap again:
	if(!anch.onmouseout) anch.onmouseout=function() {
		swapImg(anch,img);
	}
}