jQuery - 调整元素高度以匹配窗口而不刷新，在窗口调整大小

Question

我有以下脚本，如果页面刷新但工作正常，但我希望能够动态获取调整大小的窗口的大小而不刷新页面和将相应的高度应用于一个部分。

var w = $(window).width(); 
var h = $(window).height(); 

$('section').height(h); 

我错过了什么让它更加动态地工作？

Answer 1

试试下面的函数都会被调用加载窗口时间或调整：

$(window).on('load resize', function(){ 
    var w = $(window).width(); 
    var h = $(window).height(); 

    $('.section-content').height(h); 
}); 

您在确认section实际上应该是.section-content。

JSFiddle

Answer 2

$(window).resize(function(){ 
    var w = $(window).width(); 
    var h = $(window).height(); 
    $('.section-content').height(h); 
}); 

Answer 3

尝试在窗口大小调整上设置高度宽度。

Window resize height/width change Fiddle

的Jquery：

$(window).on('resize', function(){ 
var h=($(window).height(); 
var w=$(window).width(); 
$('.section-content').height(h); 
}); 

Answer 4

function setToWinSize(){ 
    var win = $(window); 
    $('section').width(win.width()).height(win.height()); 
} 

$(function(){  // on DOM ready 

    setToWinSize();  

    $(window).resize(function(){ 
    setToWinSize(); 
    }); 

});