Question

如果我向页面添加一定高度的绿色div，则会按预期添加滚动条。当我删除div时，滚动条在所有浏览器中消失，但保留在IE中，并且白色空格取代了div，不知何故，删除后div高度不会被正确重新计算。

请看这个小提琴的现场演示，你会看到它适用于除IE以外的所有浏览器。

在删除html标记规则的overflow:scroll时似乎解决了问题，遗憾的是，这不是一个选项。
我在IE，Chrome和FF以及Opera的最新版本中进行了测试。

为什么会发生这种情况？如何在dom插入后强制IE显示正确的高度？

请注意，当您调整窗口大小时，白色空白区域会立即消失，所以我只需要一种方法就可以实现这一点，而无需重新调整窗口大小。

Answer 1

似乎当IE渲染高度为100％时，如果它增长，它将保持最大尺寸，因为它现在是新的100％。为了让它再次缩小，而不是给它一个高度，你需要给它一个最小高度 - 改变你的html和body css

body, html {min-height:100%;}

这将使您的包装器在移除绿色块后重新调整大小：

修改

我发现重新渲染页面的唯一方法是在html上设置overflow属性：

$('html').css('overflow', 'auto');

http://jsfiddle.net/nzbrg/13/

Answer 2

添加$('body').css('height', 0);

Answer 3

我通过使用jQuery动画dom插入和删除（需要两者）来解决这个问题，这个解决方案只能起作用，因为我可以在课程中使用动画。

~~如果你转动动画，我认为这不会起作用~~

我很想找到更好的解决方案，但目前这就是它。无论如何动画看起来更好，所以它至少对我来说是双赢的：）

$("#spacer").slideDown();
$("#spacer").slideUp();

偷偷摸摸的更新：

如果您使用$.fx.off = true;禁用动画，那么它似乎可以工作。可能与动画偶然发现方式隐藏和显示div而不是简单地删除它的方式有关。

奇怪，因为我在删除它之前也试图隐藏元素但是没有成功。无论如何我都坚持使用动画。