使用 JavaScript 使 div 的宽度和高度等于视口答案

【问题标题】：Make divs width and height equal to viewport with JavaScript使用 JavaScript 使 div 的宽度和高度等于视口
【发布时间】：2013-04-17 21:09:45
【问题描述】：

我有一个单页网站，它使用 jquery scrollLeft 在水平对齐的 div 之间滚动，这些 div 将作为页面工作。

这些 div 应该是 100% 的宽度和 100% 的高度（等于当前视口）。

使用 jquery 我做对了：

$('.row').css('min-height', $(window).height());

$('.row').css('width', $(window).width());

$(window).resize(function() {

        $('.row').css('min-height', $(window).height());

        $('.row').css('width', $(window).width());

});

问题是在 jquery.js 完全加载并且文档准备好之前，这些 div 不会重新调整大小。

所以我认为最好的方法是使用原始 JavaScript。怎么样？

谢谢。

【问题讨论】：

标签： javascript viewport

【解决方案1】：

您是否尝试在 <div class="row">...</div> 之前加载 jquery 然后把你写的脚本放在后面？

【讨论】：

我认为这不是最好的主意，因为您应该始终坚持在 html 末尾加载 js 文件 :)
是的，你是对的。我记得我在this website 上遇到过同样的问题。如果我正确理解了您的问题，那么问题是在执行脚本之前等待所有源加载（不仅仅是 html 文件），使用 $(window).load() 而不是 $(document).ready()