html - 通过css确定屏幕高度的正确方法是什么？

Question

我想要一个布局，其中有四个彩色 div。说红色蓝色绿色黄色，它们都等于页面滚动的高度。就像我在屏幕上向下翻页时它应该显示蓝色然后绿色然后黄色加载它应该显示红色。

http://jsfiddle.net/Bv6JU/1/这是小提琴让我们改进它。

Answer 1

在 jquery 中（在纯 javascript 中也可能很简单，但我是 jquery-oholic）......

<div class="screensize" style="background-color:red"></div>
<div class="screensize" style="background-color:blue"></div>
<div class="screensize" style="background-color:green"></div>
<div class="screensize" style="background-color:yellow"></div>
<script type="text/javascript">
$(function() {
  $(".screensize").css("height",$(window).height() + "px");
})
</script>

编辑：哦，就像我说的那样，如果您想在人们调整窗口大小时保持大小一致，您将捕获调整大小事件并再次调整 div 大小。所以你会将此行添加到函数中......

$(window).resize(function() {
  $(".screensize").css("height",$(window).height() + "px");
})