javascript - 元素的高度是视口的左侧

Question

我应该如何将 div 的高度设置为视口从开始时的左侧减去 20 像素？父DIV是视口的100％，我需要孩子展开直到父母结束。

父 div 的 jquery：

$(document).ready(function(){
  windowHeight = $(window).height() - 0;
  $('.slide').css('min-height', windowHeight);
});

Answer 1

如果我正确理解您的问题，您有一个 100% 高度的父 div，在其中您有 20px 高的东西，然后应该延伸到底部的东西？（请在您的问题中明确，或包含一个代码示例作为 jsfiddle 和/或屏幕截图）。

看这个简单的例子

<div class="wrapper">
    <div class="header"> 
        Heading 
    </div>
    <div class="strecth">
        Stretching content
    </div>
</div>

实现我认为您的意思的样式：

.wrapper {
    height: 100%;
}
.header {
    height: 20px;
}
.stretch {
    height: 100%;
    padding-top: 20px;
    margin-top: -20px;
}

20px 的填充被渲染为 100% 的一部分，所以实际上你的内容.stretch将是 100% - 20px 高（这是你想要的），但是有一个 20px 的偏移量（填充）将它向下推。然后我使用负边距通过将 div 拉回 20px 来撤消偏移。效果是可见内容正好是 100% - 20px 的高度，这正是你想要的。

查看实时代码（我添加了一些颜色以进行强调，并且必须为 body 和 html 设置一些额外的高度，因为 jsFiddle 不会自动执行此操作，您不需要它）：] http://jsfiddle.net/48aET/