Question

这需要一些历史记录，以便您可以看到一个修复程序如何变成一个本身需要修复的问题：

查看Firefox中的this jsFiddle 。单击按钮，您将看到HTML区域左上角显示一个栗色框。在Chrome，IE和Safari中，在同一个jsFiddle中，带有复选框的单元格将显示maroon框，然后淡出到背景，这就是所需的行为。

注意在js代码和css中，div被添加到复选框单元格然后淡出。这应该是this jsFiddle中发现的问题的解决方案。在js代码中，你可以看到我使用的是UI Highlight效果，它可以在所有浏览器中使用，但在转到背景图像之前会逐渐变为白色。

为了解决淡入白色然后到背景图像问题，前jsFiddle应该是修复，它只引入了Firefox问题。尝试使用UI的位置效果来解决这个问题并没有帮助。

如果有人可以帮我找到一个跨浏览器的解决方案，突出显示复选框单元格而不淡化为白色，我会永远感激，就像突出显示效果一样。

Answer 1

将您的输入包装到<div style="position: relative">中，它也可以在FF中使用。 FF表格中的绝对定位似乎是一个问题，即使<td>有position: relative。

以下是修改后的fiddle。

jQuery也可以只使用动态包装/解包。通过以下方式修改JS：

 $('#classesTable input:checkbox').wrap('<div style="position: relative"/>').parent().append('<div class="checkwrap" />');

 $('#classesTable .checkwrap').fadeOut(1000, function() {
       $(this).unwrap().remove();
 });

这是fiddle

Answer 2

这不是问题 - 它是你的。 Td不能相对定位。使用div iside td width position:relative

Firefox jQuery UI位置效果

2 个答案: