Question

我想根据窗口大小计算元素的大小。

此代码有效：

var photoHeight = function() {
    return {
        'height' : ($(window).height() / 15) + 'px'
    }
}

$(document).ready(function() {
    var $obj = $('#photo');
        var photoCss = photoHeight();
        $obj.css( photoCss );
    $(window).resize(function () {
        $obj.css( photoCss );
    });
});

但我需要减去而不是分裂。如果我改变

'height' : ($(window).height() / 15) + 'px'

到

'height' : ($(window).height() - 15) + 'px'

该值似乎是“未定义的”，并且未应用.css。

完整的计算应该是这样的：

'height' : ($(window).height() - $('#page-header').outerHeight() - $('#page-footer').outerHeight() - 50) + 'px'

Answer 1

您不需要photoHeight()功能（没有更简单）：

$(document).ready(function() {
    var $obj = $('#photo');
    $obj.css("height", $(window).height() / 15);
    $(window).resize(function () {
        $obj.css("height", $(window).height() / 15);
    });
});

另请注意：如果您将变量photoCSS设置为photoHeight()，即使窗口调整大小，它也不会更改。如果您想使用某个功能，请使用$obj.css(photoHeight());

之类的内容

$（window）上的jQuery数学运算.height（）：如果除法则除法不起作用

1 个答案: