var J = jQuery.noConflict();
var width = 0;
var height = 0;
 J(window).load(function() {
            width = J(document).width();
			height = J(document).height();
      });
J(document).ready(function()
{
	var count = pics.length;
	var i = 0;
	var height2 = 100;
	 
	function showPic(i){
		J("#nav").hide();
		J("#foto img").hide().remove();
		J("#foto").prepend("<img src='css/loader.gif' id='loader' title='loader' alt='loader'/>");
		J("#foto img").css("margin-top",(height2/2)-30).css("display", "block");	
		var img = new Image();
		jQuery(img).load(function(){
			J("#foto img").hide().remove();
			J("#foto").prepend("<img src='"+img.src+"' />");
			J("#foto").animate({width: img.width+20, height: img.height+10}, 200, function()
			{
				height2 = img.height+50;
				J("#galeria").css("height", height).fadeIn();
				J("#galeria #foto #nav").css("width", img.width+20).css("top", (img.height/2)-30);
				J("#galeria #foto #nav").show();
				J("#foto img").css("display", "block");
				J("#nav").show();
			});
		}).attr({ "src": pics[i] });
	}
	J("a[href='galeria.html']").click(function()
	{
		
		J("#foto img").css("margin-top", "35px").css("display", "block");
		J("#galeria").css("height", height).fadeIn();			
		showPic(i);
		return false;
		
	});
	J("#next").live("click",function()
	{		
		i++;
		if(i==count) i = 0;
		showPic(i);
	});
	J("#prev").live("click",function()
	{
		i--;
		if(i==-1) i = count-1;			
		showPic(i);
	});
	J("#close").click(function()
	{
		i = 0;
		J("#galeria").fadeOut("fast");
	});
});