这非常简单。
我在HTML中有一堆锚点,就像这样:
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
在CSS中,我使用了悬停效果来执行translate: transform();
a {
font-size: 2em;
transition: all .3s ease-out;
}
a:hover {
transform: translate(0, -5px);
}
现在当你将鼠标悬停在锚点上时,它们应该向上移动5个像素。虽然它们确实会移动,但是它们立即弹回去了,即使鼠标仍然悬停在上面。还有其他人遇到过这种情况并找到解决方法吗?我希望效果在鼠标悬停期间保持活跃。 Codepen链接:http://codepen.io/BrianEmilius/pen/NqoLQo
body:hover
时也会出现相同的行为。它似乎更多地与加速渲染过程有关。然而,解决方案仍然是相同的 :) - Harry