Question

我正在使用jquery创建一个模态窗口。我在创建叠加层时遇到页面高度问题。

设置叠加高度我正在使用$(document).height()，这很正常。但是，如果页面高度按记录增加，则内存使用量会翻倍。

例如，如果我的页面有10条记录，当我点击链接打开模态窗口时，内存使用率从68,000k变为75,000k。

如果我的页面有100条记录，当我打开模态窗口时，内存使用量为135,000k。

这显然是因为文档高度。

这可以在IE8中找到。

请帮我解决如何在不影响记忆的情况下获取文件高度的问题。

Answer 1

IE8支持css位置：已修复，可用于定位叠加层和对话框，而无需参考文档高度。然后你可以使用像

这样的东西

$("#myDialog").css({
    position: "fixed",
    top: ($(window).height() - $("#myDialog").outerHeight())/2
})

和覆盖的css

.overlay {
    background: none repeat scroll 0 0 #000000;
    height: 100%;
    left: 0;
    opacity: 0.7;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1;
}
.ie7 .overlay, .ie8 .overlay {
    background: url("../img/lb-overlay.png") repeat scroll 0 0 transparent; /*image is a 1px by 1px semi transparent png*/
}

这可能会或可能不会解决内存问题，但通常是定位模式对话框的更好方法（它仅在ie6中失败）。

Answer 2

为什么不使用相对于视口的固定位置来定位叠加层，而不是创建覆盖整个页面的叠加层？

您可以尝试使用以下CSS来实现此目的：

#overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

这样可以避免不断增加叠加层的高度，并覆盖整个视口。

jquery文件高度内存使用情况

2 个答案: