$(function(){

    var $box=$("#box");

    var $img=$box.find("img");

    var imgWidth=$img.eq(0).width();

    var exposeWidth=160;

    var boxWidth=imgWidth+exposeWidth*($img.length-1);

    var translate=imgWidth-exposeWidth;

    $box.width(boxWidth);

    $img.not($img.eq(0)).each(function(i){   //i从0开始

        var left=imgWidth+i*exposeWidth;

        $(this).css("left",left);

        $(this).data("pos",left);                       //向pos元素附加数据left

    });

    $img.each(function(i){

        $(this).mouseover(function(){

            //开门

            for(var j=1;j<=i;j++){

                var $imgs=$img.eq(j);

                $imgs.animate({"left":$imgs.data("pos")-translate},200);              //从pos元素取得初始位置

            }

            //关门

            for(var j=i+1,len=$img.length;j<len;j++){

                var $imgs=$img.eq(j);

                $imgs.animate({"left":$imgs.data("pos")},200);    

            }

        });

    });    

});