Question

情况

我创建了一个HTML“书”，其中每个页面都是div（check this link (cant post images yet)）。

div有绝对的位置，因为它们必须在彼此之上。

现在这本书的高度必须是最高页面的高度。所以我创造了一个“高度守护者”div，它具有“可见性：隐藏”，因此高度守卫div从不可见，但保持书的高度与最高页面一样高。

到目前为止一切顺利，但现在......

问题

当书籍初始化时，我用javascript检查每一页的高度。我得到该页面的内容并将其添加到高度管理员。

$book.find("div.page").each(function () {
                        pageHeight = $(this).height();

                        if (highestPagePx < pageHeight) {
                            highestPagePx = pageHeight;
                            highestPageContent = $(this).html();
                        }
                    });

这在所有现代浏览器中都很完美，但现在我正在调试IE8，这需要花费很多时间...... 在我的虚拟机中（这不是很快但旧的计算机上的旧浏览器）每页需要大约40毫秒。 10页几乎是半秒钟。在网页上有3本书需要1.5秒。我的意见很长。

anybode能否提供创意解决方案？

我在考虑如何将相对div设置在彼此之上，因此整个身高不变的东西是不必要的。但我无法弄清楚如何做到这一点。

Answer 1

少尝试jQuery：

var pages   = $book.find("div.page").get(),
    highest = 0;

for (var i=0; i<pages.length; i++) {
    if ( pages[i].clientHeight > highest) highest = pages[i].clientHeight;
}

for (var i=0; i<pages.length; i++) {
    pages[i].style.height = highest;
}

Answer 2

我认为这需要很多时间：
highestPageContent = $(this).html();

更好地获得最大页面的索引：
highestPageContentIndex = $(this).index();

和外循环：
highestPageContent = $("div.page").eq(highestPageContentIndex).html();

获得div高度的最快方法

2 个答案: