Question

我编写了这段代码，根据屏幕上的可用空间更改包装盒的宽度和高度。当我打开页面时，div加载得很好但是当我调整它的大小时，div的大小不会改变。

var width = (($(window).width()) - 100);
var height = (($(window).height()) - 100);

$(window).ready(function() {
    $("#wrapper").width(width);
    $("#wrapper").height(height);
});

$(window).resize(function(){
    $("#wrapper").width(width);
    $("#wrapper").height(height);
});

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Xyz</title>
</head>
<body>
    <div id="wrapper">
        asd
    </div>
</body>
</html>

Answer 1

您需要重新计算事件处理程序中的$(window).ready(calculateSize); $(window).resize(calculateSize); function calculateSize() { var width = $(window).width() - 100; var height = $(window).height() - 100; $("#wrapper").width(width); $("#wrapper").height(height); }和#wrapper { position: absolute; top: 0; left: 0; right: 100px; bottom: 100px; }变量：

QTablewidget

但请注意，仅在CSS中就可以这样做：

label

Answer 2

您需要重新计算尺寸。

Host *
    ControlMaster auto
    ControlPath ~/.ssh/sockets/%r@%h-%p
    ControlPersist 600

Answer 3

我使用我写的这个功能并且运行良好：

//when I load the page
window.onload = function(event) { resizeDiv(); }
//when I resize the page
window.onresize = function(event) { resizeDiv(); }

function resizeDiv() {
    vpw = $(window).width()-100; 
    vph = $(window).height()-100;

    $('#wrapper').css({'height': vph + 'px'});
    $('#wrapper').css({'width': vpw + 'px'});   
}

在加载时调整Div宽度并调整大小

3 个答案: