(function($){
	$.fn.viewanimate=function(option){
		var defaults={imgscale:1.2},
		opts=$.extend({},defaults,option),
		_this=$(this),
		p_article=_this.find(opts.p_article),
		width,
		height;
		function init(){
			p_article.width((_this.width()-(opts.columnnum-1)*opts.spacew)/opts.columnnum)
			p_article.height(function(){
				return $(this).width()/opts.percent
			})
			width=p_article.width(),
			height=p_article.height()
			_this.height(function(){
				// return opts.linenum*(p_article.height()+opts.spaceh)-opts.spaceh
				if(opts.linenum*opts.columnnum<=p_article.length){
					return opts.linenum*(p_article.height()+opts.spaceh)-opts.spaceh
				}else{
					return math.ceil(p_article.length/opts.columnnum)*(p_article.height()+opts.spaceh)-opts.spaceh
				}
			})
		}
		p_article.mouseenter(function(e){
			mouseeffect(e,$(this));
		}).mouseleave(function(e){
			mouseeffect(e,$(this));
		})
		var i=0,n=opts.columnnum,col=0;//i,n选择li的范围，起始索引和结束索引，col当前行
		function expand(){//每一行显示完毕后执行下一行展开效果，递归
			p_article.slice(i,n).css({top:height*col+opts.spaceh*col+"px"}).each(function(m){
				$(this).animate({left:m*opts.spacew+m*width+"px",opacity:1},opts.exduration,function(){
					if(m==opts.columnnum-1){
						i=n;
						n=i+opts.columnnum;
						col++;
						expand();
					}	
				})
			})	
		}
		init()
		expand();
		function mouseeffect(e,ele) {
			var _that=ele,
			_desc=_that.find(opts.p_container).stop(true),
			left=e.pagex-_that.offset().left,
			top=e.pagey-_that.offset().top,
			right=width-left,
			bottom=height-top,
			_min=math.min(left,top,right,bottom),
			img=_that.find("img"),
			animateprop={left:0,top:0},
			spos=_min==left?{left:-width,top:0}:_min==top?{left:0,top:-height}:_min==right?{left:width,top:0}:{left:0,top:height};//鼠标划入之前的初始化位置
			animation();
			function animation(){
				var zoomwidth=width*opts.imgscale,
				zoomheight=height*opts.imgscale,
				spacex=(zoomwidth-width)/2,
				spacey=(zoomheight-height)/2;
				if(e.type=="mouseleave"){
					console.log(spos)
					_desc.animate(spos,opts.duration);
					img.stop().animate({width:width+"px",height:height+"px",left:0,top:0},100);
				}else if(e.type=="mouseenter"){
					_desc.css(spos).animate(animateprop,opts.duration);
					img.stop().animate({width:zoomwidth+"px",height:zoomheight+"px",left:-spacex+"px",top:-spacey+"px"},300);
				}
			}
		}
	}
})(jquery);