Css 过渡后悬停

若要查看此错误，请将鼠标悬停在覆盖框的右侧（悬停后，即使是1px也不要移动鼠标）：

.container.hoverMover{宽度：100px；高度：100px；背景：rgba（0,0,0.2）；}
.container{位置：相对；}
.hoverMover{位置：绝对；顶部：0；左侧：50px；}
.container:hover.hoverMover{background:green；left:0；}
.trans{-webkit转换：所有1轻松输入输出；转换：所有1轻松输入输出；}

请注意，即使dom元素向左移动，它仍保持绿色，并设置“：hover”。移动鼠标后，此选项将立即取消设置。当dom元素从鼠标下方移动时，即使鼠标未移动，如何将其取消设置

---

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

这只在事件中才可能，因此您需要某种迭代循环来完成所需的任务

<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>