将div设置为浏览器窗口的高度

Question

我有2个div，一个在另一个之上，我希望它们都是浏览器窗口的100％宽度和高度，同时仍然在文档中维护它们的顺序。

目前您可以看到我刚刚添加了一个内联样式，使框的高度为500px，因此它们可见。

到目前为止的相关代码可以在这里找到：

http://fiddle.jshell.net/pY6dc/9/

我对此非常陌生，所以你可能需要用简单的术语来解释。我知道我可能需要某种形式的javascript来实现这一点，不知道哪里开始。

克里斯

Answer 1

在JavaScript中执行此操作的一种方法：

$(".slide").height($(window).height());

它的作用是用一类幻灯片选择所有元素，然后将它们的高度设置为窗口高度。

更新了小提琴：here

但基本上我假设您可以自己连接jQuery，一旦这样做，您可以通过多种方式注册窗口加载函数，最简单的方法是在脚本标记中（更合适的方式是在头部你的文件。）

---

<script type='text/javascript'>
   $(window).load(function(){
      $(".slide").height($(window).height());
   });
</script>