DOM 移除时的 CSS3 高度转换？

Question

请检查以下 fiddle :http://jsfiddle.net/tWUVe/

当您单击 div 时，p 会被删除，我希望 div 的高度会被设置为动画，但没有动画发生。如何仅使用 CSS3 实现动画？

Answer 1

问题是没有机会进行转换。我的意思是，当元素被移除时，它们会立即从文档流中移除，并在需要时调整父元素的大小而无需过渡。

作为对此的修复，您可以改为设置段落高度的动画(或类似的方法)

$('div').click(function() {
    var $thisDiv = $(this);
    $thisDiv.find('p').css({'height':'0px','margin':'0px'}); // Change p height

    // Remove after transition
    setTimeout(function() { $thisDiv.find('p').remove(); }, 1000); 
});

Demo