CSS在特定情况下删除空格

Question

看看这个。

http://jsfiddle.net/DTxQf/18/

当您点击右下方框的主体时，“TOO”会附加到ul并向上动画。这导致向＃window-frame添加空白区域。我不想要这个。我希望“TOO”和“NEXT ITEM”之间没有差距。可以使用CSS完成吗？我宁愿不用使用JS的高度傻瓜。此外，任何有关为何发生这种情况的见解？

由于

Answer 1

如果列表必须相对定位，请设置marginTop而不是top。

JSFiddle

Answer 2

尝试使用margin-top而非动画top属性：

$('#latest-image-list').animate({marginTop: "-=20"}, "fast");

以下是演示：http://jsfiddle.net/DTxQf/27/

另外，在旁注中，您创建了height变量而没有将var语句放入全局范围（否则它将位于window.load事件处理程序中范围）。始终使用var来确保不会不必要地创建全局变量（每次查找变量时都会产生额外的开销）。

Answer 3

这应该解释：http://jsfiddle.net/DTxQf/32/

MOO在哪里？不可见（在顶部折叠下），但仍然存在。
尽管将列表翻译了20px，但它仍然需要相同的空间。