1

尝试使用 jQueryUI 将表格列滑出视图，然后再滑入。遗憾的是，它似乎没有保留正确的列宽和位置，因此列最终出现在错误的位置。

我遇到的问题的提炼版本位于http://jsfiddle.net/Z76xE/6/。我已经看到了许多不同的不良行为变体，但这里指出的简单案例只会在扩展操作上感到困惑：它首先将列扩展为大于 CSS 修复的 150px，然后在末端将其左边缘对齐以使列再次变为 150px，在表格的左侧留下空白区域。

在无休止地玩这个和跟踪 JavaScript 的过程中，我意识到 jQuery 获得的列宽与 CSS 声明的不同。所以我在 [not] 告诉 jQuery / jQueryUI 更新其对列宽的理解方面做错了。我只是不知道在哪里！

感谢您的任何想法。

4

1 回答 1

1

如果您在打开 DOM 检查器的情况下观看动画，您会看到<td>被包裹在 a 中<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 以获得您想要的视觉布局，但该结构应该让您的动画得到整理。

于 2012-05-10T04:13:52.550 回答