Question

我的位置设置有问题。我有滚动类型的页面，每一帧（如每个部分）都设置为100％的宽度和高度。他们都有position: absolute。第一帧顶部：0，左：0，第二顶部：100％，左：0;等等... 但是当我需要更多的文字，而不是100％的高度，我显然无法显示它，因为下一节... 如何正确设置这个位置？

CSS：

#about {
width: 100%;
height: 100%;
background:white; 
position: absolute;
top: 100%;
left: 0;
z-index: 1;
}

HTML：

<div id="about" class="yourDivClass">
...
</div>

Answer 1

您可以使用javascript / jQuery在文档加载时动态设置每个div的顶部。不要在CSS中设置高度的任何初始值，并让它扩展到应该占用的全部大小。

HTML：

<div class='yourDivClass' id="div1">
     ...
</div>
<div class='yourDivClass' id="div2">
     ...
</div>
<div class='yourDivClass' id="div3">
     ...
</div>
<div class='yourDivClass' id="div4">
     ...
</div>

的Javascript / jQuery的：

$(document).ready(function() {
    var totalHeight = 0;
    $(".yourDivClass").each(function() {
        $(this).css("top", totalHeight);
        var height = ($(this).height() > $(window).height()) ? $(this).height() : $(window).height();
        $(this).css("height", height);
        totalHeight += height;
    });
});

请参阅此jsFiddle。

绝对位置与最小高度

1 个答案: