jq实现相册的改进，由重叠到打开

      一直很喜欢各种相册展开的例子，但是一直没有时间自己去写一个，这段时间刚好把工作做的差不多了，就写了一个比较简单的例子，希望和大家有个好的交流。

     写的不好希望大家能多多提出自己的建议，我会及时作出修改以及回应大家的。

     

                var states=false;
                var funev;
		
		var position={"pos":
		  [
			{"posX":0,"posY":0},
			{"posX":0,"posY":"33%"},
			{"posX":0,"posY":"66%"},
			{"posX":"33%","posY":0},
			{"posX":"33%","posY":"33%"},
			{"posX":"33%","posY":"66%"},
			{"posX":"66%","posY":0},
			{"posX":"66%","posY":"33%"},
			{"posX":"66%","posY":"66%"}
		  ]
		};//位置信息
		console.log(position.pos[1].posX);
		var divs=$(".contanner").find("div").length;
		var i=0;
		var degnum=0;
		var move = function(){
			if(i<divs&&states==false){
				$(".contanner .data-"+i).removeClass("remove").addClass("addmove");
				$(".contanner .data-"+i).animate({
				  top:position.pos[i].posX,
				  left:position.pos[i].posY},
				  1000);
				  i++;

			  }else if(i==divs&&states==false){
                states=true;
                i=divs;
                clearInterval(funev);
              }
            else if(i>=0&&states==true){
                $(".contanner .data-"+i).removeClass("addmove").addClass("remove");
                $(".contanner .data-"+i).animate({
                            top:(60-i)+"%",
                            left:"33%"},
                        1000);
                i--;
				}
			else if(i<0&&states==true){
                states=false;
                i=0;
                clearInterval(funev);
              }
			}
			$(".btn").click(function(e) {
                funev = setInterval("move()",400);
            });

      代码里面的那段json，是进行位置标记的，可能在本例子中还体现不出来这种效果的优势，但是在插件开发和游戏开发的时候这种写法的优势就会很明显了。这种写法最终出现的效果就是你点击一个图片集的时候，里面的图片会一张一张的翻转显示，再次点击的时候图片就会一张一张的收回。看起来整个效果还是很有feeling的。

       大家如果有好的建议或者是我有什么写的不好的位置，希望大家能不吝赐教。谢谢您观看此博客。