Question

我试图通过jQuery .css()给出我的容器元素高度和宽度，但我的代码将其设置为窗口高度和宽度。任何人都可以告诉我为什么代码不起作用？

以下是代码：

$(document).ready(function () {
    var H = $(window).height();
    var W = $(window).width();
    var h = W / 1.625;
    var w = H * 1.625;
    if (w > W) {
        $("#container").css("height", h + 'px').css("maxWidth", W + 'px;');
    else {
        $('#container').css("maxHeight", H + 'px').css("width", w + 'px;');
    }
});

Answer 1

您的if语句缺少}，因此首先不起作用。变化：

if(w>W)  
{
    $("#container").css("height", h+'px').css("maxWidth", W+'px;');
    else
        ...

要：

if(w>W)  
{
    $("#container").css("height", h+'px').css("maxWidth", W+'px;');    
}                
else
    ...

同样，当您设置多个CSS属性时，可以通过将属性作为对象传递，将它们组合成一个CSS方法：

if (w>W) 
{
    $("#container").css({height:h, maxWidth:w});
}
...

jQuery在大多数情况下为你排序px。有关详细信息，请参阅jQuery的css() documentation。：）

Answer 2

你错过了}上的右括号if，所以你的代码应该是这样的，

if (w > W) {
    $("#container").css("height", h + 'px').css("maxWidth", W + 'px;');  
}
else {
    $('#container').css("maxHeight", H + 'px').css("width", w + 'px;');
}

通过将css属性作为对象的一部分传递而不是链接，可以提高代码的可读性，因为添加许多属性在将它们作为对象传递时非常有用。

if (w > W) {
    $("#container").css({
         "height": h + 'px', 
         "max-width": W + 'px'
    });  
}
else {
    $("#container").css({
         "max-height": H + 'px', 
         "width": w + 'px'
    });
}

css（）没有设置高度和宽度

2 个答案: