function setOpacity(obj, o) {
    obj.opacity = o;
    obj.style.opacity = (o / 100);
    obj.style.MozOpacity = (o / 100);
    obj.style.KhtmlOpacity = (o / 100);
    obj.style.filter = 'alpha(opacity=' + o + ')';
}

/** This method fades an image in over another image across various
 ** different browsers. It assumes the images are contained within a
 ** div element sized to the same width as the images and sets the
 ** div background to the current image after fading in.
 **
 ** param obj - the image object to be faded
 ** param objIncr - the percentage opacity for each increment
 ** param refRate - the time between increments (100ths of a second)
 ** param imgUrl - the url for the new image
 ** 
 ** return - N/A
 **/
function fadeImageIn(obj, objIncr, refRate, imgUrl) {
    if ((undefined == objIncr) || (null == objIncr)) objIncr = 10;
    if ((undefined == refRate) || (null == refRate)) refRate = 10;
    if (undefined != imgUrl) {
	var currentUrl = new String(obj.src);
	obj.style.display = 'block';
	obj.parentNode.style.backgroundImage = "url("+obj.src+")";
	obj.parentNode.style.backgroundRepeat = "no-repeat";
	setOpacity(obj,0);
	obj.fadeincrement = objIncr;
	obj.faderate = refRate*10;
	if (0 > currentUrl.indexOf(imgUrl) ) { obj.src = imgUrl; }
    } else {
	setOpacity(obj,obj.opacity + obj.fadeincrement);
    }
    if (obj.opacity < 100) {
	setTimeout(function() {fadeImageIn(obj);}, obj.faderate);
    } else {
	obj.parentNode.style.backgroundImage = "url("+obj.src+")";
	obj.parentNode.style.backgroundRepeat = "no-repeat";
	setOpacity(obj,0);
    }
}