Question

我正在使用jQuery来隐藏和显示表格中的行。

这是我的jsFiddle：http://jsfiddle.net/Nbf75/5/

请注意，当您点击一个问题时，答案会滑入，但它会回答问题。如果你没有设置动画，它就不会这样做，但我想要一个动画（不一定是预设的慢动画，但任何动画都要动画它。）

那么如何让动画不要挤压问题？

编辑：这种情况发生在Chrome但不是Firefox，尚未在任何其他浏览器中进行过测试

Answer 1

这是渲染引擎如何处理表格单元格的工件。您可以通过将答案（在td内）包裹在div中并直接在div上操作来解决此问题。 td将跟随（因为它自动调整大小）并且所有浏览器的效果都相同。

<强> See it in action

Answer 2

只需使用fadeOut和fadeIn代替show和hide。没有压扁，你将达到理想的效果。

示例：

$('table tr td.question').toggle(function() {
    $($(this).parent('tr').next('tr').children('.answer')).fadeOut('slow');
}, function() {
    $($(this).parent('tr').next().children('.answer')).fadeIn('slow');
});

http://jsfiddle.net/Nbf75/10/

jQuery慢速squishes表

2 个答案: