function Detail(f) {													// fonction appelée sur un click par exemple
	var nImage = f;
	
	var xhr=null;
	var position="zoom";											// nom de l'emplacement à modifier (peut être une variable passée à la fonction)
	if (window.XMLHttpRequest) { 
		xhr = new XMLHttpRequest();
	} 																	//  Objet xhr pour Firefox, Safari, ...
	else if (window.ActiveXObject) {
		xhr = new ActiveXObject("Microsoft.XMLHTTP");
	}	 																// Objet xhr pour Internet Explorer 
	xhr.onreadystatechange  = function() { 								// à chaque changement du statut la functon() est exécutée
		if(xhr.readyState  == 4 && xhr.status  == 200) {
			document.getElementById(position).innerHTML=  xhr.responseText;
			cacher();
		} // tout est OK, positionnement sur l'élément  "position" et mettre le code contenu dans responseText à la place (et affichage)
		else {
			document.getElementById(position).innerHTML="Error code " + xhr.status;
		}
	} 																	// fin fonction function()											
	
	url = "index.php?ajax=1&page=detail&image="+nImage ;
	
	xhr.open("GET", url, true);			// page à appeler avec la méthode Post et en mode synchrone
	xhr.send(null); 													// envoi le requête au serveur
}

function cacher() {
	document.getElementById('imageFlow').style.display = 'none';
}

function change_pict(n){
	elem = document.getElementById("affichage");
	var temp = parseInt(elem.style.left);
	if (isNaN(temp)){temp=0;}
	
	i = 1 ;
	while (temp!=n){
		if (temp<n){
			temp=temp+10;
			setTimeout("moveHight();",10 * i++);
		}
		else {
			temp=temp-10;
			setTimeout("moveLow();",10 * i++);
		}
	}
}

function moveHight(){
	document.getElementById("affichage").style.left = (parseInt(document.getElementById("affichage").style.left)+10) + "px";
}
function moveLow(){
	document.getElementById("affichage").style.left = (parseInt(document.getElementById("affichage").style.left)-10) + "px";
}

//function change_pict(n){
	//elem = document.getElementById("affichage");
	//setTimeout(elem.style.left = n + "px",2000)
	//elem.style.left = n + "px";	
//}

function flow(){
	document.getElementById('zoom').innerHTML="";
	document.getElementById('imageFlow').style.display = 'block';
}
