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

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的块被放置在你想要取消悬停块的位置。