jQuery.Revealing图片展示插件

$(document).ready(function(){
		
$('.photo_slider').each(function(){
	
	var $this = $(this).addClass('photo-area');
	var $img = $this.find('img');
	var $info = $this.find('.info_area');
		
	var opts = {};
	
	$img.load(function(){
		opts.imgw = $img.width();
		opts.imgh = $img.height();
	});
	
	opts.orgw = $this.width();
	opts.orgh =  $this.height();
	
	$img.css ({
		marginLeft: "-150px",
		marginTop: "-150px"
	});
	
	var $wrap = $('<div class="photo_slider_img">').append($img).prependTo($this);

	var $open = $('<a href="#" class="more_info">More Info ></a>').appendTo($this);
	
	var $close = $('<a class="close">Close</a>').appendTo($info);
	
	opts.wrapw = $wrap.width();
	opts.wraph = $wrap.height();
	
	$open.click(function(){
		$this.animate({ 
			width: opts.imgw,
			height: (opts.imgh+30),
			borderWidth: "10"
		}, 600 );
				
		$open.fadeOut();
		
		$wrap.animate({ 
		    width: opts.imgw,
			height: opts.imgh
		}, 600 );

		$(".info_area",$this).fadeIn();
		
		$img.animate({
			marginTop: "0px",
			marginLeft: "0px"
		}, 600 );
		
		return false;
	});
	
	$close.click(function(){
		$this.animate({ 
			width: opts.orgw,
			height: opts.orgh,
	        borderWidth: "1"
	      }, 600 );
		
		$open.fadeIn();
		
		$wrap.animate({ 
	        width: opts.wrapw,
			height: opts.wraph
		      }, 600 );
		
			$img.animate({
				marginTop: "-150px",
				marginLeft: "-150px"
			}, 600 );

		$(".info_area",$this).fadeOut();
		return false;
	});
	
});

});