$(window).bind('load', function () {
       $("div#navigation ul li a span.vertbar").css({"opacity" : "0.3"});
    });

$(document).ready(function() {
	$.ifixpng("../images/pixel.gif");
	$("#galleryAccueil #mainPhoto").ifixpng();
	$("#galleryAccueil ul#thumbs1 li.thmb1").ifixpng();	
	$("#galleryAccueil ul#thumbs1 li.thmb2").ifixpng();	
	$("#galleryAccueil ul#thumbs1 li.thmb3").ifixpng();
	$("#galleryAccueil ul#thumbs1 li.thmb4").ifixpng();
	$("div.vivreLeJardin h2").ifixpng();
	$("#galleryRealisations div#mainPhoto").ifixpng();
	$("div.coords").ifixpng();
	$('div.transparentLogo').ifixpng();
});

$(document).ready(
	
    function(){
      
		 // On click events navigation
		$('div#navigation ul li a').append('<span class="bar"></span>');
		$('div#navigation ul li a').append('<span class="leaf"></span>');
		$('div#navigation ul li a').append('<span class="vertbar"></span>');
		$('div#navigation ul li a').append('<span class="arrow"></span>');
		
		$("div#navigation ul li a.clickable").hover(			 	 
			function () {
				$("span.leaf", this).stop().animate({ opacity: 1, left: "34" }, 100 );
				$("span.bar", this).stop().animate({ opacity: 0.9, width: "230" }, "fast" );
				$("span.arrow", this).stop().animate({ opacity: 0, left: "60" }, 30 );
				$("span.vertbar", this).stop().animate({ opacity: 0.9, left: "67", top: "5" }, 30 );
			},
			function () {
				$("span.leaf", this).stop().animate({ opacity: 0, left: "-34" }, 100 );
				$("span.bar", this).stop().animate({ opacity: 0, width: "0" }, "fast" );
				$("span.arrow", this).stop().animate({ opacity: 0.9, left: "49" }, "fast" );
				$("span.vertbar", this).stop().animate({ opacity: 0.4, left: "67", top: "6" }, 30 );
			}
		);

   });