$(document).ready( function() {
	$("ul.gallery-items li a").hover(
		function() {
			var win_width = document.documentElement.clientWidth;
			var win_height = document.documentElement.clientHeight;
			var win_scroll_x = (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft;
			var win_scroll_y = (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop;
			var top = $(this).children("img").position().top;
			
			$("body").append(
				$("<div>").attr("id", "displayed-photo-frame").css({
					"position": "absolute",
					"z-index": 666
				})
			);
			
			$("<img>").attr(
				"src", $(this).attr("href")
			).attr(
				"id", "displayed-photo"
			).appendTo("#displayed-photo-frame");
				
			var w = $("#displayed-photo").width();
			var h = $("#displayed-photo").height();
			var x = win_width/2 - w/2;
			var y = top - $("#displayed-photo").height() - 20;

			$("#displayed-photo-frame").css({
				"height": h + "px",
				"left": x + "px",
				"top": y + "px",
				"width": w + "px"
			});
		},

		function() {
			$("#displayed-photo").remove();
			$("#displayed-photo-frame").remove();
		}
	);
});