$(document).ready(function(){
		
$('.canvas_gallery').each(function(){
	
	var w = 975; // È®´ëµÈ Æ˾÷ Å©±â(Width)
	var h = 480; // È®´ëµÈ Æ˾÷ Å©±â(Height)
	
	var $this = $(this);
	var $img = $this.find('img');
	var i_frame = $("#iframe");
	
	var $info = $this.find('.bottom_btn');
		
	var opts = {};
	
	$img.ready(function(){
		opts.imgw = w; // È®´ëµÈ Æ˾÷ Å©±â(Width)
		opts.imgh = h; // È®´ëµÈ Æ˾÷ Å©±â(Height)
	});
	
	opts.orgw = $this.width();
	opts.orgh =  $this.height();
	
	// Æ˾÷ È®´ë½Ã ³»ºÎ °¶·¯¸® À§Ä¡ (À§Ä¡ Àâ´Â¿ëµµ·Î¸¸ »ç¿ëµÊ. »èÁ¦ °¡´É)
	var $wrap = $('<div class="canvas_gallery_img">').append($img).prependTo($this);
	// [Open] È®´ë¹öÆ°
	var $open = $('<a href="#" class="open_btn_area">[More]</a>').appendTo($this);
	// [Close] ´Ý±â ¹öÆ°
	var $close = $('<a class="close" style="cursor: pointer;">[Close]</a>').appendTo($info);
	
	opts.wrapw = $wrap.width();
	opts.wraph = $wrap.height();
	
	// [Open]¹öÆ° Ŭ¸¯ ½Ã
	$open.click(function(){
		// ·¹À̾îµåÆ˾÷ Ä¿Áö´Â ¾Ö´Ï¸ÞÀ̼Ç
		$this.animate({ 
			left:-200, //(ÁÂÃøÀ¸·Î À̵¿)
			top:-135,
			width: opts.imgw,
			height: (opts.imgh+30), // +30Àº Border µÎ²²
			borderWidth: "10"
		}, 600 );
				
		$open.fadeOut(); // [Open]¹öÆ° °¨Ãã
		
		// ·¹À̾îµåÆ˾÷ ½Ã ¹öÆ° ÀÚ¸® Àâ±â À§ÇÑ ºÎºÐ.(»èÁ¦ °¡´É)
		$wrap.animate({ 
		    width: opts.imgw,
			height: opts.imgh
		}, 600 );

		// [Close] ´Ý±â ¹öÆ° FadeIn
		$(".bottom_btn",$this).fadeIn();

		// À̹ÌÁö FadeOut
		$img.fadeOut();
		
		// Canvas Gallery (iFrame ºÎºÐ)
		i_frame.height(h);
		i_frame.width(w);
		i_frame.css("display","block");
		i_frame.attr("src","/main/CanvasGallery.html");
		
		return false;
	});
	
	// [Close] ´Ý±â ¹öÆ° Ŭ¸¯ ½Ã
	$close.click(function(){
		// ·¹À̾îµåÆ˾÷ Ãà¼Ò
		$this.animate({ 
			left: 0, // ¿ø·¡À§Ä¡·Î µÇµ¹¾Æ¿Àµµ·Ï 0
			top: 0,  // ¿ø·¡À§Ä¡·Î µÇµ¹¾Æ¿Àµµ·Ï 0
			width: opts.orgw,
			height: opts.orgh,
	        borderWidth: "1"
	      }, 600 );
		
		// [Open] ¹öÆ° FadeIn
		$open.fadeIn();
		
		// ·¹À̾îµåÆ˾÷ ³» À§Ä¡ Àâ´Â ¿ä¼Ò (»èÁ¦ °¡´É)
		$wrap.animate({ 
	        width: opts.wrapw,
			height: opts.wraph
		      }, 600 );
		// À̹ÌÁö ÆÄÀÏ FadeIn
		$img.fadeIn();

		// ¹öÆ° ¿µ¿ª FadeOut
		$(".bottom_btn",$this).fadeOut();
		// Canvas Gallery °¨Ãã (iFrame ¿µ¿ª)
		i_frame.css("display","none");
		return false;
	});
	
});

});