image_num = 1;

function opacity(id, opacStart, opacEnd, millisec) {
	//speed for each frame
	var speed = Math.round(millisec / 100);
	var timer = 0;
	
	//determine the direction for the blending, if start and end are the same nothing happens
	if(opacStart > opacEnd) {
	   for(i = opacStart; i >= opacEnd; i--) {
	      setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
	      timer++;
	   }
	} else if(opacStart < opacEnd) {
	   for(i = opacStart; i <= opacEnd; i++) {
	      setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
	   timer++;
	   }
	}
}

//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 + ")";
}

function shiftOpacity(id, millisec) {
   //if an element is invisible, make it visible, else make it ivisible
   if(document.getElementById(id).style.opacity == 0) {
      opacity(id, 0, 100, millisec);
   } else {
      opacity(id, 100, 0, millisec);
   }
}

function blendimage(divid, imageid, imagename, millisec) {
   var imagename;
   var speed = Math.round(millisec / 100);
   var timer = 0;

   //set the current image as background
   document.getElementById(divid).style.backgroundImage = "url(" + document.getElementById(imageid).src + ")";
   //document.getElementById(divid).style.title = "hola";
   
   //make image transparent
   changeOpac(0, imageid);
   
   if (image_num < 6)
  		image_num = image_num + 1;
  	else
  	   image_num = 1;
   imagename = imagename + image_num + ".jpg";

   //make new image
   document.getElementById(imageid).src = imagename; 
   //imagefile;
   
   //fade in image
   for(i = 0; i <= 100; i++) {
      setTimeout("changeOpac(" + i + ",'" + imageid + "')",(timer * speed));
      timer++;
   }
}

function currentOpac(id, opacEnd, millisec) {
   //standard opacity is 100
   var currentOpac = 100;

   //if the element has an opacity set, get it
   if(document.getElementById(id).style.opacity < 100) {
      currentOpac = document.getElementById(id).style.opacity * 100;
   }

   //call for the function that changes the opacity
   opacity(id, currentOpac, opacEnd, millisec)
}

setInterval("blendimage('blenddiv','blendimage','images/cabecera/imagen',2000)", 5000);