鼠标移动 img有问题

Question

CSS：

    #img-box{
    margin:90px auto;
    height:475px;
    position:relative;
    overflow:hidden;
    border-bottom:1px solid #ccc;
    border-right:1px solid #ccc;
}
#img-box img{
    position:absolute;
    display:block;
    left:0;
    border-left:1px solid #ccc;
    transition:1s;
   -moz-transition:1s; /* Firefox 4 */
   -webkit-transition:1s; /* Safari 和 Chrome */
   -o-transition:1s; /* Opera */

HTML：

<div id="img-box">          
               <img src="img/1.png">
               <img src="img/2.png">
               <img src="img/3.png">
               <img src="img/4.png">
</div>

js：

window.onload=function(){
    var box=document.getElementById("img-box");
    var imgs=box.getElementsByTagName("img");
    var imgWidth=imgs[0].offsetWidth;
    var exposeWidth=180;
    var boxWidth=imgWidth+(imgs.length-1)*exposeWidth;
    box.style.width=boxWidth+"px";
    function setImgsPos(){
    for(var i=1;i<imgs.length;i++){
        imgs[i].style.left=imgWidth+exposeWidth*(i-1)+"px";
        }}
        setImgsPos();
    var translate=imgWidth-exposeWidth;
    for(i=0;i<imgs.length;i++){
        (function(i){
            imgs[i].onmouseover=function(){
                setImgsPos();
                for(var j=1;j<i;j++){
                    imgs[j].style.left=parseInt(imgs[j].style.left,10)-translate+"px";
                    }}
            }
        )(i);
        }    
}

Answer 1

具体下想解决什么问题啊