// fonction parallax
function parallaxEffect(elem) {
	// durée de l'animation
	// on récupère la taille du cadre contenant l'ensemble de l'image générée
	var widthAreaParallax = $("#layerback").width();
	// on calcule la distance entre le coté gauche de la fenêtre et le cadre gauche de l'image
	var offsetImage = $("#layer1").offset().left;
	var bgPositionLeft = elem.clientX-widthAreaParallax/2;
	var delayAnim = 2500 -(Math.abs(bgPositionLeft-offsetImage)*5);
	// curseur de type "progress" durant le lancement de la fonction
	$("#layerback").css({ cursor: "progress" });
	// on déplace pour chaque calque le fond d'image de droite à gauche selon le mouvement de la souris
	// c'est le coefficient multiplicateur différent d'un calque à l'autre qui rends cet effet de parallax
	$("#layer1").animate({ backgroundPosition: ((bgPositionLeft-offsetImage) * -0.4 )+ 'px 0px'}, delayAnim);
	$("#layer2").animate({ backgroundPosition: ((bgPositionLeft-offsetImage) * -0.30 )+ 'px 0px'}, delayAnim);
	$("#layer3").animate({ backgroundPosition: ((bgPositionLeft-offsetImage) * -0.15 )+ 'px 0px'}, delayAnim);
	$("#layer4").animate({ backgroundPosition: ((bgPositionLeft-offsetImage) * -0.10 )+ 'px 0px'}, delayAnim, function() {
		$("#layerback").css({ cursor: "pointer" });
	});
}
	
// variable regroupant les navigateurs IE antérieur à la version 7
var old_ie = $.browser.msie && /MSIE\s(5\.5|6\.)/.test(navigator.userAgent);

// au chargement de la page
$(document).ready(function() {
	if (!old_ie) {
		// on vire la notification pour ceux qui n'ont pas le malheur d'avoir une vieille version d'IE
		$("#layer1").text("");
		// on initialise le curseur en "pointeur" au passage sur l'image générée
		$("#layerback").css({ cursor: "pointer" });
		// on lance la fonction parallax au clic du curseur de la souris
		$("#layerback").click(parallaxEffect);
	}
});