jquery - jQueryUI对表列的影响

尝试使用jQueryUI将表列滑出视图，然后再滑回。可悲的是，它似乎没有保留正确的列宽和位置，因此该列最终放置在错误的位置。

我遇到的问题的简化版本位于http://jsfiddle.net/Z76xE/6/。我已经看到了多种不希望有的行为变体，但是这里指出的简单案例只是对expand操作感到困惑：首先将列扩展为大于CSS固定为150px的列，然后在末尾对齐其左边缘，使列再次变为150px，在表格的左侧留出空白。

在无休止地使用它并通过JavaScript进行跟踪的过程中，我意识到jQuery的列宽与CSS声明的不同。因此，我在[不]告诉jQuery / jQueryUI更新对列宽的理解上做错了。我只是不知道在哪里！

感谢您的任何想法。

最佳答案

如果在打开DOM检查器的情况下观看动画，则会看到<td>被包裹在<div>中，并且<div>被动画化。但是，这：

<tr>
    <div>
        <td></td>
    </div>
</tr>

是无效的HTML，因此谁知道浏览器将要处理什么样的奇怪和奇妙的事情。我们确实知道会发生一件奇怪的事情：将<td>设置为动画时，它将把放在错误的位置。

摆弄表格元素的位置和显示有点麻烦，因此最好避免这样做。如果将HTML更改为此：

<td>
    <div id="NavColumn">
        I am the left-side column
    </div>
</td>

那么您会得到更好的运气：http://jsfiddle.net/ambiguous/VUvCw/

您必须稍微调整CSS才能获得所需的视觉布局，但是该结构应该使您的动画更整齐。

关于jquery - jQueryUI对表列的影响，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/10527256/