$(窗口).身高不断增长

Question

我正在尝试动态调整网页的一部分,但该部分只会保持增长,即使窗口的高度减少了.所以我记录了身高并且有些奇怪.

这是应该调整大小的功能(这个想法是这个类的三个部分中的每个部分应该占据整个屏幕,迫使用户向下滚动以进入下一个):

function set_section_min_height(){
    var newHeight = jQuery(window).height();
    console.log("Window: " + newHeight);
    console.log("Section: " + jQuery(".pgsc_frontpage_section").height());
    if(newHeight > jQuery(".pgsc_frontpage_section").height()){
        jQuery(".pgsc_frontpage_section").height(newHeight);
    }
}

文档准备好并在每次调整大小时调用该函数:

jQuery(document).ready(function(){set_section_min_height()});
jQuery(window).resize(function(){set_section_min_height()});

这是降低窗口高度后的日志

Window: 972
Section: 150
Window: 3356
Section: 972
Window: 10508
Section: 3356
Window: 31964
Section: 10508
Window: 96332
...

它一直持续到我得到:

Window: 33554431
Section: 33554428

Answer 1

根据您描述的用例,您可能不需要(或想要)jQuery.CSS单元vh可以很好地为您服务.

.pgsc_frontpage_section {
  height: 100vh;
}

这会将div的高度设置为屏幕的整个高度.