2

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

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

http://jsfiddle.net/nzbrg/16/

删除 for html 标记规则后,问题似乎得到了解决overflow:scroll,不幸的是,这不是一个选项。
我在最新版本的 IE、Chrome 和 FF 和 Opera 中对此进行了测试。

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

请注意,当您调整窗口大小时,白色空白空间会立即消失,所以我只需要一种方法来实现这一点,而无需实际调整窗口大小。

4

3 回答 3

1

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

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

这应该使您的包装器在删除绿色块后调整大小:

http://jsfiddle.net/nzbrg/6

编辑

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

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

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

于 2013-05-14T09:39:03.433 回答
0

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

http://jsfiddle.net/nzbrg/4/

于 2013-05-14T08:26:59.280 回答
0

我通过使用 jQuery 动画 dom 插入和删除(需要两者)来解决这个问题,这个解决方案只有效,因为我可以使用动画。

如果你打开动画,我认为这不会起作用

我很想找到一个更好的解决方案,但目前就是这样。无论如何,动画看起来更好,所以它是双赢的(至少对我来说):)

见这里:http: //jsfiddle.net/nzbrg/15/

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

偷偷更新:

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

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

于 2013-05-14T10:32:16.773 回答