var slides = 6; 								 // number of images in slideshow
var loc = "images/headerFade/";	 // location of images               

for(i = 1; i > slides; i++) { 
		preloadImage(i);
} 

function preloadImage(count) {
	imageX = new Image();
  imageX.src = loc+count+".jpg";
}
  
var counter=1;                 //initialize the slide counter                          
var imageid="slideimage";
var divid="slideshow";
function rollPics() {
	var speed = 5; 
  var timer = 0;   
  
  //fade out image
	for(i = 100; i >= 1; i--) { 
		setTimeout("changeOpac(" + i + ",'" + imageid + "')",speed * timer);
    timer++;
	} 
  
	document.getElementById(imageid).src = loc + counter + ".jpg";        //Display image "counter".jpg
  changeOpac(100, imageid);                   //reset image opacity so its visible
	counter ++;                                 // Add 1 to counter
  if (counter>slides) {                            // If counter is greater than 4 images then reset it
    counter=1
	}
  document.getElementById(divid).style.backgroundImage = "url(" + loc + counter + ".jpg)";  
} 

//change the opacity for different browsers 
function changeOpac(opacity, id) { 
    var object = document.getElementById(id).style; 
    object.opacity = (opacity / 100); 
    object.MozOpacity = (opacity / 100); 
    object.KhtmlOpacity = (opacity / 100); 
    object.filter = "alpha(opacity=" + opacity + ")"; 
}
