Javascript 使用jquery窗口调整div大小

我已经将页面分割为三个div，并尝试使用jquery设置它们的维度，以便每个div始终与窗口大小相同

我的代码正在工作，但在连续几次调整窗口大小后，div resize开始延迟。调整窗口的大小越大，延迟越大，直到浏览器窗口出现崩溃

我能做些什么使调整大小更平滑并防止崩溃

这是我的密码：

$（文档）.ready（函数（）{
截面尺寸（）
函数sectionSize（）{
var w=[]
var h=[]
var docWidth=$（窗口）.width（）
var docHeight=$（窗口）.height（）
w、 推（docWidth）；
h、 推（八）；
$（“.section”）.css({
“高度”：h，
“宽度”：w
});
$（窗口）.on（'resize'，function（））{
w、 推（docWidth）；
h、 推（八）；
截面尺寸（）
});
}
})

正文{
保证金：0；
}
.科{
位置：相对位置；
}
.第p节{
位置：绝对位置；
底部：5px；
左：45%；
}
#顶{
背景颜色：蓝色；
}
#中间的{
背景色：红色；
}
#底部{
背景颜色：绿色；
}

下一个

下一个

下一个

你能不能不使用CSS

高度：100vh？将其应用于
。部分

这里有一把小提琴：
在你的html头标签中

在css中使用媒体查询-

@media screen and (max-width: 400px) {
        .section{
           height : 100px;
           width : 400px;
        }
      }

@media screen and (min-width:450px){
    .section{
       height : //change your css accordingly
       width : //change your css accordingly
    }

}

在您的代码更改大小之前，您需要取消注册调整大小处理程序，然后在调整大小完成后注册它。您每次都在创建一个嵌入式函数，而且每次都要推到一堆数组，看起来它会疯狂地泄漏内存。我怀疑这可能是问题所在Jeff，虽然我是个初学者，但我不知道如何避开它。杰夫-谢谢你的提示，我一定会研究的。设置宽度似乎没有必要，因为它是一个默认为100%的块级元素。