//Object to hold our data to be updated on the CSS
//  classIdName = the ID you want to change property of
//  propertyName = property you want to change
//  newValuesList = the list of new values you want to loop through
function classCSS(classIdName, propertyName, newValuesList){
	this.idName = classIdName;
	this.propName = propertyName;
	this.valueList = newValuesList;
	this.counter = 1;
}

//Function that changes CSS values base on the cssObject passed in
function changeCSSPropertyValue(cssObject)
{
	//resets counter so becomes continues loop
	if (cssObject.counter == cssObject.valueList.length){
		cssObject.counter = 0;
	}

	// new image URL 
	newValue = "url('" + cssObject.valueList[cssObject.counter] +"') no-repeat top center";
	
	// swaps image for the background, adds the fadein/fadeout for the helper DIV
	$("#" + cssObject.idName + "-helper").css(cssObject.propName,newValue);
	$("#" + cssObject.idName).fadeOut('4000', function(){
		$(this)
			.css(cssObject.propName,newValue)
			.fadeIn('4000');
	});

	cssObject.counter++;
}