引导崩溃行的颜色变化延迟

Question

我想更改表格中折叠行的颜色，但由于某种原因会有延迟。当您点击图标时，行会展开，但颜色会发生变化。有办法解决这个问题吗？

Fiddle

.table>tbody>tr.collapse>td {
background-color:red;
}

Answer 1

Bootstrap在显示元素的过渡期间删除collapsed类，并且仅在转换结束后再次添加它。

但是，它在转换期间添加了类collapsing - 因此，如果您为该类提供红色背景颜色的元素，它应该按照您的意愿工作。

.table>tbody>tr.collapse>td,
.table>tbody>tr.collapsing>td{
    background-color:red;
}

.table>tbody>tr:not(.collapse):not(.collapsing):nth-child(odd)>td {
    background-color:#ecf3f8;
}

http://jsfiddle.net/dy83cxaw/5/