悬停和取消悬停进入无限循环

Question

代码：http://jsfiddle.net/Gwx6E/

当您将鼠标悬停在 div 上并且 div 边界到达光标时，将应用 .a 类的正常样式。 使其在光标下移动，从而触发悬停。这进入了无限循环。 有什么办法可以解决这个问题，单独使用 css3 吗？

Answer 1

不，这是所需的行为（但是在某些浏览器中存在差异：并非每个人都会在光标不移动的情况下更新悬停状态）。

您可以尝试更改代码的方式：添加一个包装器并在其上触发悬停，因此只有子块会移动，但悬停仍会在父块上。

这里是一个例子：http://jsfiddle.net/kizu/Gwx6E/1/

另一种方法是使用伪元素，它会被定位在屏幕上，所以当它动画时，悬停总是在元素上，这里有一个例子：http://jsfiddle.net/kizu/Gwx6E/2/——但是缺点是你可以'直到没有更大的z-index 的块将被放置在您想要取消悬停该块的位置之前，不要取消悬停该块。