// JavaScript Document
(function($){
		$.fn.showImage=function(settings){
			st=$.extend({
				loading: "images/loading.gif"
			},settings);
			$(this).click(function(){
				showBg();
				if(document.body.scrollTop==0){
					scroll_top=document.documentElement.scrollTop;  //for ie
				}else{
					scroll_top=document.body.scrollTop;    //for firefox....
				}
				//alert(document.body.scrollTop);
				$("body").append('<div id="imgBox"></div>');
				$("#imgBox").css({
					position: "absolute",
					zIndex: 200,
					width: "300px",
					height: "100px",					
					left: ($(document).width()-320)/2+"px",
					top: (document.documentElement.clientHeight-40)/2+scroll_top+"px",
					background: "#000",
					textAlign: "center",
					padding: "10px",
					color: "#ccc",
					display: "none"
				}).append("<span><img src='"+st.loading+"' id='loading' /></span>").fadeIn();
				$("#loading").css({marginTop:"36px"});
				var tmpImg=new Image();
				tmpImg.src=$(this).attr("href");
				tmpImg.onload=function(){
					$("#imgBox > span").replaceWith('<img src="'+tmpImg.src+'" id="targetImg" />');
					$("#targetImg").css({ display: "none"	});
					t_width=$("#targetImg").width();
					t_height=$("#targetImg").height();
					t_left=($(document).width()-t_width)/2;
					t_top=(document.documentElement.clientHeight-t_height)/2+scroll_top;
					$("#imgBox").animate({
						top: t_top+"px",
						left: t_left+"px",
						width: t_width+"px",
						height: t_height+"px"
					},600);
					setTimeout(function(){ $("#imgBox > img").fadeIn(); },800);					
				}
				return false;
			});
			function showBg(){
				$("body").append("<div id='showBg'></div>");
				$("#showBg").css({
					display:"none",
					position:"absolute",
					top:"0px",
					left:"0px",
					zIndex:1,
					width:$(document).width()+"px",
					height:$(document).height()+"px",
					background:"#000",
					opacity:0.4
				}).fadeIn();
				$("body").click(function(){
					$("#showBg,#imgBox").animate({opacity:"hide"},600);
					setTimeout(function(){ $("#showBg,#imgBox").remove() },600);
				});				
			}
		}
})(jQuery);