TR剪辑背景的jQuery fadeIn()

Question

如果我执行更改表格尺寸的 fadeIn()，Firefox 会剪切新显示行的背景。

如果我在远离标签的地方单击焦点，然后单击返回，背景将恢复。

Chrome 中没有裁剪问题。我在 Firefox 26 上

参见 JSFiddle

JS

$(function () {
    $(".small-link").on("click", function (event) {
        $(".showfields").fadeIn(250);
    });
});

CSS

.head {
    background-color: green;
    color:white;
}
.hidden {
    display:none;
}
.small-link {
    cursor:pointer;
}
table {
    border:1px solid red;
}

HTML

<table>
    <tr>
        <td><a class="small-link">Click this</a>
        </td>
    </tr>
    <tr class="hidden showfields">
        <td>........................................</td>
    </tr>
    <tr class="head hidden showfields">
        <th>Table Head</th>
    </tr>
</table>

注意事项:

1. 只是展示TR作品，但如果可以的话我想淡化它
2. 淡化 TH 和 TD 确实解决了这个简单案例的问题，但不适用于我的实际代码

Answer 1

不确定这是否是 FF 错误，但您可以使用 .fadeTo() 而不是 .fadeIn() 来绕过它。

$(".showfields").fadeTo(250,.99);

jsFiddle example