javascript - $(window).height() 上的 jQuery 数学运算：如果除法不工作，如果减法工作

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());