jQuery：平滑调整表格单元格的大小以进行文本替换

Question

我有一个没有固定宽度列的表（这是可以的）。目前长文本打印两次：前50个字母和隐藏字段中的完整文本。

像这样：https://jsfiddle.net/vrtf6q14/

单击短版本时，当文本淡出然后增加到完整大小时，colwidth（和height）会减小。反之亦然。

是否有任何技巧可以“平滑”将单元格调整为新尺寸？是否可以将两个文本同时切换到彼此之上？使用div和position:absolute可能吗？

也许这很简单，但我被卡住了。

Answer 1

您无法将CSS转换应用于TR或TD元素。

然而，您可以在DIV中包装TD元素的内容，并将动画/变换应用于div。 TD应该使比例/宽度/任何内容与其内部的Div一起动画。

<tr>
  <td><div>Your Content</div></td>
  <td><div>Your Content</div></td>
</tr>