timeDelay = 10000 // This value is for the delay between changing images
$.fadeDelay = 2000 // This value is for the time the fade between images takes 
$(document).ready(function(){ 
	$.imageCount = $('ul#jsrImages li[id*=jsr]').length
	$.jsrCounter =  Math.floor((Math.random()*$.imageCount) + 1);	 //This is the counter that runs the rotator, set it to what image you want the rotator to start on	
	
	for(i=1;i<$.imageCount + 1;i=i+1){
	 thisDiv = $('<a href="javascript:jumpImages(' + i + ')"></a>')
	 thisDiv.attr("id","jsrBtn" + i).appendTo("#navBox");
	}
	jumpImages($.jsrCounter)
 });
 function jumpImages(jsrCounter){
 	clearInterval(timeInterval)
	timeInterval =  setInterval("swapImages($.jsrCounter, $.imageCount);", timeDelay);
	$.jsrCounter = jsrCounter;
	swapImages(jsrCounter, $.imageCount);
	}
 function swapImages(jsrCounter, imageCount){	
	$("#fade2").html($("#fade1").html()).show().fadeOut($.fadeDelay);
	$("#fade1").html($("#jsr" + jsrCounter).html()).fadeIn($.fadeDelay);
	$("[id*=jsrBtn]").removeClass("over")
	$("#jsrBtn" + jsrCounter).addClass("over")
	if($.jsrCounter == $.imageCount){
		$.jsrCounter = 1
	 }else{
	 	$.jsrCounter++
	};	
};
var timeInterval = setInterval("swapImages($.jsrCounter, $.imageCount);", timeDelay);
