徘徊时的重置转换

Question

我希望将move.down函数重置，当我将鼠标悬停在div上时。 现在它不重置，但只是再次回升。 有关这个问题的任何帮助将非常appriciated。

见代码：

CSS

#box_1{ 
    border-radius:12px; 
    display: block; 
    position: relative !important; 
    width: 204px; 
    height: 203px; 
    background:url(http://biready.visseninfinland.nl/wp-content/uploads/2014/01/input1.png); 
    background-size:204px 203px; 
    background-repeat:no-repeat; 
} 

#box_1 .hoverImg { 
    position: absolute; 
    left: 0; 
    top: 0; 
    width: 204px; 
    height: 203px; 
    display: none; 
} 

#box_1:hover .hoverImg { 
    display: block; 
    width: 204px; 
    height: 203px; 
} 

#axis1:hover .move-down { 
    transform: translate(0,100px); 
    -webkit-transform: translate(0,100px); 
    -o-transform: translate(0,100px); 
    -moz-transform: translate(0,100px); 
} 

.object1 { 
    position: absolute; 
    transition: all 5s ease-in; 
    -webkit-transition: all 5s ease-in-out; /** Chrome & Safari **/ 
    -moz-transition: all 5s ease-in-out; /** Firefox **/ 
    -o-transition: all 5s ease-in-out; /** Opera **/ 
} 

.object1 { 
    position: absolute !important; 
} 
.line1 { 
    top: 8%; 
    left: 5%; 
    width: 180px; 
    height: 15px; 
} 

#box_1:hover .move-down { 
    transform: translate(0,150px); 
    -webkit-transform: translate(0,150px); 
    -o-transform: translate(0,150px); 
    -moz-transform: translate(0,150px); 

}

HTML

<div id="box_1"> 
<div id="axis1"><img class="object1 line1 move-down" src="http://biready.visseninfinland.nl/wp-content/uploads/2014/01/balkje1.gif"/></div> 
<div class="hoverImg"><img src="http://biready.visseninfinland.nl/wp-content/uploads/2014/01/input2-80.png" width="204" height="203" alt=""></div> 
</div> 

见琴：http://jsfiddle.net/38m6u/

期待ŧ o回应。

Answer 1

上空盘旋#box_1，而不是当过渡应该发生：

从.object1取出过渡，并将其添加到选择#box_1:hover .move-down

UPDATED EXAMPLE HERE

#box_1:hover .move-down { 
    transform: translate(0, 150px); 
    -webkit-transform: translate(0, 150px); 
    -o-transform: translate(0, 150px); 
    -moz-transform: translate(0, 150px); 
    transition: all 5s ease-in; 
    -webkit-transition: all 5s ease-in-out; 
    -moz-transition: all 5s ease-in-out; 
    -o-transition: all 5s ease-in-out; 
}