如何将最小高度和最小宽度添加到jQuery.width和.height_Jquery_Html_Css_Window Resize

如何将最小高度和最小宽度添加到jQuery.width和.height

jquery html css

如何将最小高度和最小宽度添加到jQuery.width和.height,jquery,html,css,window-resize,Jquery,Html,Css,Window Resize,我有一个单页网站，正在尝试使用CSS设置最小高度和宽度。但是jQuery似乎忽略了我的最小尺寸我正在使用以下方法调整窗口的大小： $(window).resize(function () { resizePanel(); }); function resizePanel() { width = $(window).width(); height = $(window).height(); mask_width = width * $('.item').lengt

我有一个单页网站，正在尝试使用CSS设置最小高度和宽度。但是jQuery似乎忽略了我的最小尺寸

我正在使用以下方法调整窗口的大小：

$(window).resize(function () {
    resizePanel();
});
function resizePanel() {
    width = $(window).width();
    height = $(window).height();
    mask_width = width * $('.item').length;
    $('#wrapper, .item').css({width: width, height: height});
    $('#mask').css({width: mask_width, height: height});
}

Html如下所示

</head>
<body>


<div id="wrapper">
<div id="mask">

    <div id="item1" class="item">
    </div>

    <div id="item2" class="item">
    </div>

    <div id="item3" class="item">
    </div>

    <div id="item4" class="item">
    </div>

</div>
</div>

</body>
</html>

任何想法都会受到极大的欢迎。

Jquery实际上通过

width

和

height

覆盖了您的

minwidth

和

minheight

，因此您可以做以下几点：

$(window).resize(function () {
    resizePanel();
});
function resizePanel() {
    width = $(window).width();
    height = $(window).height();
    mask_width = width * $('.item').length;
    $('#wrapper').css({width: width, height: height});
    $('.item').css({minWidth: width, minHeight: height});
    $('#mask').css({width: mask_width, height: height});
}

将渲染最大的值（高度>最小高度或反之亦然）

因此，如果你正在设计你的网页，那么请记住这一点

1.具有更大的
最小高度
和
最小宽度


div{
边框：1px实心#4CAF50；
最小高度：200px；
最小宽度：200px；
高度：50px；
宽度：50px；
}
此元素具有更大的最小高度和最小宽度。

谢谢你的提示，但这似乎会导致我的网站发生一些不可预知的事情，它会水平滚动以显示页面上的每个项目。但现在，一旦我调整浏览器窗口的大小，它就会变得一团糟……看起来我将不得不让它完全调整大小，或者只是重新考虑我的设计……@Aaron，这不是jquery的问题，我已经用纯html测试了简单的代码，它仍然不起作用<代码>div{高度：100vh；宽度：100%；边框：1px实心#4CAF50；最小高度：100px；最小宽度：100px；}

$(window).resize(function () {
    resizePanel();
});
function resizePanel() {
    width = $(window).width();
    height = $(window).height();
    mask_width = width * $('.item').length;
    $('#wrapper').css({width: width, height: height});
    $('.item').css({minWidth: width, minHeight: height});
    $('#mask').css({width: mask_width, height: height});
}