$(document).ready(function() {
 
    /* grey screen */
    $("body").append('<div id="screen"></div><div id="popup"></div>\n');
    $("#popup").hide().css({
		position: 'absolute',
		background: '#fff',
		border: '1px solid',
		padding: '10px',
		float: 'left',
		maxWidth: '800px',
		textAlign: 'center',
		opacity: '0'
	});
    $("#screen").hide().css({
       position: 'absolute',
       left: '0px',
       top: '0px',
       background: '#000'
    });
 
 });
 
 function popup($img, path) {	
	$("#screen").css({
		width: $(document).width(),
		height: $(document).height(),
		opacity: 0.75
	});

	$("#popup").html("<form><fieldset><input type='button' value='Close' class='add' /></fieldset></form><img src='"+path + $img.attr("src").split("/").pop()+"' alt='' />")
	$("#popup img").css({margin: '20px 20px 10px 20px'}).load(function() {
		$("#popup").show().css({width: $("#popup img").width() + 40 + "px"}).css({
				top: $(window).scrollTop() + 20 + 'px',
				left: (($(window).width() - $("#popup").width()) / 2) + 'px'
			})
			.animate({opacity: '1'});
		$("#screen").fadeIn();
		$("#popup input.add").css("visibility", "visible");
	});

	$("#popup input.add").css({float: 'right'}).click(function() {
		$("#popup").animate({opacity: '0'}, function() {$(this).hide()});
		$("#screen").fadeOut();
	});
 }