css - 过渡后悬停

要见证该错误，请将鼠标悬停在此处的叠加框的右侧（悬停后，即使将鼠标移动1像素也是如此）：
http://jsfiddle.net/V99rf/

<style>
.container, .hoverMover {width:100px; height:100px; background:rgba(0,0,0,.2);}
.container {position:relative;}
.hoverMover {position:absolute; top:0; left:50px;}

.container:hover .hoverMover {background:green; left:0;}

.trans {-webkit-transition: all 1s ease-in-out; transition: all 1s ease-in-out;}
</style>
<div class="container">
  <div class="hoverMover trans">
  </div>
</div>

请注意，即使dom元素移到左侧后，它也保持绿色，并设置了“：hover”。移动鼠标后，此设置将立即取消。当dom元素从鼠标下方移动时，即使不移动鼠标，如何设置为未设置状态？

递归javascript超时可能不令人满意，但可能是唯一的方法...？

最佳答案

这仅对于事件才有可能，因此您将需要某种迭代循环来完成所需的内容。