google-chrome - Delay with tr:hover using Chrome

Question

I have noticed there's an small delay trying to highlight a row using tr:hover td over Chrome browser (tested on version 26).

If you move the cursor fast over the table you will notice the row under it is not already highlighted.

I am using this css:

tr:hover td {
    background-color: transparent;
}

Here's the fiddel when you can see the small delay: http://jsfiddle.net/5VJ8n/89/

Is there any way to solve it? Thanks.

Answer 1

这是 webkit 中的一个已知错误（现在已经有一段时间了）。divs如果您将内容包装在其中，然后将 div 定位在悬停中，您可以获得一点速度提升。

<tr>
  <td><div>One</div></td>
  <td><div>Two</div></td>
  <td><div>Three</div></td>
</tr>

tr:hover div {
  color: #fff;
  background-color: #000;
}

Answer 2

这实现了完全相同并且完美地工作：

td:hover, td:hover ~ td {
//css here
}