 <!--
 //--------- VARIABLES
 var width_init = 124; // largeure des miniatures
 var width_fin  = 130; // largeure des images grossies
 var height_fin = 130; // hauteur finale
 var left_init = 60; // position gauche du premier ŽlŽment
 var between_images = 50; // ecartement entre les images superposŽes

 var nb_appear = 10; // nb d'interpolation pour l'affichage du texte
 var appear_pause = 20; // pause en 10 ms avant affichage texte
 var disappear_pause = 1000; // pause en ms avant fermeture affichage texte


 var final_z;
 var coeffi=width_fin/width_init; // Coefficient de reduction 
 var larg=width_fin;//largeur maxi de l'image
 var haut=height_fin;//hauteur maxi de l'image
 var pas = .09;
 

 var ie = navigator.appVersion.match(/MSIE (\d+\.\d+)/, '');

 
 function growing_image(div_name, image_name)
 	{
 	this.init_z;
 	this.current_z;
 	this.div_name	= div_name;
 	this.image_name	= image_name;
 	this.coeff	= coeffi;
 	this.chang	= '';
 	this.initi	= '';
 	this.appear_timer = '';
 	this.disappear_timer = '';
 	this.compt = 0;
 	this.count = disappear_pause;
 	
 	this.activated = false;
 	}
 
 function my_stuff(name)
 	{
 	this.varname = name
 	this.mytable = new Array();
 	}
 
 
  my_stuff.prototype.switch_ = function(num)
 	{	
 	if (this.mytable[num].active) 
 		{
 		this.mytable[num].active = false;
 		hide(num);
 		}
 	else 
 		{
 		this.mytable[num].active = true;
 		show(num);
 		}
 	}
 
 my_stuff.prototype.add_image = function(div_name, image_name)
 	{	
 	last = this.mytable.length;

 	temp = new growing_image(div_name, image_name);

	temp.init_z = last+1;
	temp.current_z = temp.init_z;
 	this.mytable[last] = temp;
 	
 	new_width  = Math.round(larg/coeffi);
 	new_height = Math.round(haut/coeffi);
 	
 	document.getElementById(image_name).width  = new_width
 	document.getElementById(div_name+"-content").style.width = new_width;
 	
 	document.getElementById(image_name).height = new_height;
 	
 	document.getElementById(div_name).style.left = (left_init + ((last-1)*between_images))+"px";
 	document.getElementById(div_name).style.zIndex = last;
 	
 	final_z = last+5;
  	
 	return last;
 	}
 
 my_stuff.prototype.appear = function(sel)
 	{
 	
 	if (this.mytable[sel].count > 0)
 		{
 		this.mytable[sel].count --;
 		this.mytable[sel].appear_timer = window.setTimeout(this.varname+'.appear('+sel+');',10);
 		}
 	else if (this.mytable[sel].compt < nb_appear)
 		{
 		this.mytable[sel].activated = true;
 		window.clearTimeout(this.mytable[sel].disappear_timer);
 		this.mytable[sel].compt ++;
 		document.getElementById(this.mytable[sel].div_name+'-content').style.visibility = "visible";
	 
	    if (ie)	document.getElementById(this.mytable[sel].div_name+'-content').style.filter = "alpha(opacity:"+Math.round(this.mytable[sel].compt*100/nb_appear)+")";
	    else	document.getElementById(this.mytable[sel].div_name+'-content').style.opacity = this.mytable[sel].compt/nb_appear;
	    
	 	this.mytable[sel].appear_timer = window.setTimeout(this.varname+'.appear('+sel+');',30);
	 	}
	else 
		{
		window.clearTimeout(this.mytable[sel].appear_timer);
		this.mytable[sel].compt = nb_appear;
		this.mytable[sel].count = disappear_pause;
		}
 	}

  my_stuff.prototype.disappear = function(sel)
 	{
 	if (this.mytable[sel].activated == true)
 	{
 	if (this.mytable[sel].count > 0)
 		{
 		this.mytable[sel].count --;
 		this.mytable[sel].appear_timer = window.setTimeout(this.varname+'.disappear('+sel+');',10);
 		}
 	else if (this.mytable[sel].compt > 0)
 		{
 		window.clearTimeout(this.mytable[sel].appear_timer);
 		this.mytable[sel].compt--;

	 	//visibility & opacity
 		document.getElementById(this.mytable[sel].div_name+'-content').style.visibility = "visible";
	 	
	 	if (ie)	document.getElementById(this.mytable[sel].div_name+'-content').style.filter = "alpha(opacity:"+Math.round(this.mytable[sel].compt*100/nb_appear)+")";
	    else	document.getElementById(this.mytable[sel].div_name+'-content').style.opacity = this.mytable[sel].compt/nb_appear;
	    
	 	this.mytable[sel].appear_timer = window.setTimeout(this.varname+'.disappear('+sel+');',30);
	 	}
	else 
		{
		window.clearTimeout(this.mytable[sel].disappear_timer);
		document.getElementById(this.mytable[sel].div_name+'-content').style.visibility = "hidden";
		
		this.mytable[sel].compt = 0;
		this.mytable[sel].activated = false;
		this.initial(sel);
		}
	}
	else this.initial(sel);
 	}
 
 my_stuff.prototype.changer = function(sel)
 	{
 	 if (parseInt(document.getElementById(this.mytable[sel].image_name).width) < larg)
			 {
			 window.clearTimeout(this.mytable[sel].initi);
			 this.mytable[sel].coeff = this.mytable[sel].coeff-pas;
			 //taille image
			 document.getElementById(this.mytable[sel].image_name).width = Math.round(larg/this.mytable[sel].coeff);
			 document.getElementById(this.mytable[sel].image_name).height = Math.round(haut/this.mytable[sel].coeff);
			 // taille div texte
			 document.getElementById(this.mytable[sel].div_name+'-content').style.width = Math.round(larg/this.mytable[sel].coeff)+"px";
			
			 //pos Z
			 this.mytable[sel].current_z += (final_z +1 - this.mytable[sel].init_z)/(this.mytable[sel].coeff/pas/2);
			 document.getElementById(this.mytable[sel].div_name).style.zIndex = Math.round(this.mytable[sel].current_z);
			 
			 this.mytable[sel].chang = window.setTimeout(this.varname+'.changer('+sel+');',30);//vitesse de l'effet
			 }
	 if (parseInt(document.getElementById(this.mytable[sel].image_name).width) >= larg)
	 	{
	 	this.mytable[sel].count = appear_pause;
	 	document.getElementById(this.mytable[sel].div_name).style.zIndex = final_z+2;
	 	window.clearTimeout(this.mytable[sel].chang);
	 	this.appear(sel);
	 	}
 	}
 
 my_stuff.prototype.initial = function(sel)
 	{
 	if (document.getElementById(this.mytable[sel].image_name).width > larg/coeffi) 
 		{
 		 window.clearTimeout(this.mytable[sel].appear_timer);
		 window.clearTimeout(this.mytable[sel].chang);
		 this.mytable[sel].coeff = this.mytable[sel].coeff+pas;
		 //taille image
		 document.getElementById(this.mytable[sel].image_name).width = Math.round(larg/this.mytable[sel].coeff);
		 document.getElementById(this.mytable[sel].image_name).height = Math.round(haut/this.mytable[sel].coeff);
		 
		 // pos Z
		 this.mytable[sel].current_z -= (final_z - this.mytable[sel].init_z)/(this.mytable[sel].coeff/pas);
		 document.getElementById(this.mytable[sel].div_name).style.zIndex = Math.round(this.mytable[sel].current_z);
		 
		 //taille div texte
 		 document.getElementById(this.mytable[sel].div_name+'-content').style.width = Math.round(larg/this.mytable[sel].coeff)+"px";	 

		 this.mytable[sel].initi = window.setTimeout(this.varname+'.initial('+sel+');',30);//vitesse de  l'effet
 		 }
	if (document.getElementById(this.mytable[sel].image_name).width <= larg/coeffi)
		{
		this.mytable[sel].current_z = this.mytable[sel].init_z;
		document.getElementById(this.mytable[sel].div_name).style.zIndex = this.mytable[sel].init_z;
		window.clearTimeout(this.mytable[sel].initi);
		}
 	}
 	
 
 function show(num)
 	{
 	my_elements.changer(num); 
 	}
 
 function hide(num)
 	{
 	my_elements.disappear(num);
 	}
 
  function show2(num)
 	{
 	my_elements2.changer(num); 
 	}
 
 function hide2(num)
 	{
 	my_elements2.disappear(num);
 	}
 
 function switch_mode(num)
 	{
 	my_elements.switch_(num);
 	}
 
 // init variables
 var my_elements = new my_stuff("my_elements");
 my_elements.mytable[0] = "";
 var my_elements2 = new my_stuff("my_elements2");
 my_elements2.mytable[0] = "";
 //-->