$(document).ready(function () {

	$('#link').click(function () {

		$('#over').css({
			'position' : 'absolute',
			'top' : '0',
			'left': '0',
			'height' : document.body.scrollHeight ? document.body.scrollHeight : $('body').height(),
			'width':   $('body').width(),
			'background-color':'black',
			'background-repeat': 'repeat',
			'opacity':'0.7',
			'display':'none',
			'z-index':100
		});

		$('#over_frame').css({
			'position' : 'absolute',
			'top' : '100px', //$(this).offset().top
			'left' : $(this).offset().left - 480,
			'height' : 360,
			'width': 480,
			'display':'none',
			'overflow':'hidden',
			'z-index':102
		});

		//boton cerrar
		$('#over_frame p a').click(function () {
			
			$('#over, #over_frame').fadeOut();
		});

		// ocultar objetos flash
		$('embed, object, select').css({ 'visibility' : 'hidden' });

		//hacer visible
		$('#over_frame, #over').fadeIn();

		$('#over_frame, #over_frame div').animate({
			'width'  : $('#over_frame div img').width(),
			'height' : $('#over_frame div img').height() + $('#over_frame p').height(),

		},800, function () {

			$('#over_frame div img').fadeIn();
		});

		//Añadir evento: siguiente imagen
		$('#over_frame div img').css('cursor','pointer').click(function () {	showNext();	});

	});

	return false;
});


function showNext () {

	////////////////
	// Añadir evento: Cerrar en caso de ser la última imagen
	
	if($('#over_frame div img').attr('rel') == 'undefined' || $('#over_frame div img').attr('rel') == undefined) {

		$('#over_frame p a').click();
		return false;
	}

	////////////////

	//ocultar imagen
	$('#over_frame div img').fadeOut();

	// restaurar ancho / alto por defecto
	$('#over_frame div').animate({'height' : 360,'width': 480},800, 
	function () {

		var newSrc = $('#over_frame div img').attr('rel');
		$('#over_frame div img').remove();
		$('#over_frame div').append('<img src="' + newSrc + '" style="display:none;" />');

		load_control();
	});

	return false;
}

function load_control () {

	// Comprobar que la imagen a sido cargada por el navegador
	var img = $('#over_frame div img');

	if(img[0].complete == true) {

		setTimeout (showImg, 50 );

	} else {

		setTimeout (load_control, 500 );
	}
}

function showImg () {

	//Añadir evento: siguiente imagen
	$('#over_frame div img').click(function () {	showNext();	});

	//Actualizar ancho /alto 
	$('#over_frame, #over_frame div').animate({
		'width' :  $('#over_frame div img').width(),
		'height' : $('#over_frame div img').height(),
	},800,
	 function() {

		$('#over_frame div img').css('cursor','pointer');
		$('#over_frame div img').fadeIn();
	});
}