// JavaScript Document

var prev = 1;
	
function singlechange(changeto){
	var x = document.getElementById("producpic" + changeto);
	var y = document.getElementById("producpic" + prev);
	y.style.zIndex = "10";
	x.style.zIndex = "50";
	changeOpac(100,prev);
	prev = changeto;
}

function startchange(changeto){
	if (changeto != prev){
	var idname = "";
	idname = "producpic" + changeto;
	var x = document.getElementById(idname);
	x.style.zIndex = "40";
	effects(3,changeto);
	}
}

	function effects(fx,changeto){
		
		if (fx == 3){
			//opacity
			opacity(prev, 100, 0, 1000,changeto);
		}
		
	}
	
function opacity(id, opacStart, opacEnd, millisec,changeto) {
    //speed for each frame
    var speed = Math.round(millisec / 600);
    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++;
        }
    }

	timer++;
	setTimeout('singlechange(' + (changeto) + ')',(timer*speed));
}	
	
function changeOpac(opacity, id) {
	var idname = "";
	idname = "producpic" + id;
    var object = document.getElementById(idname).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
} 		

