jquery - 使用 JQuery 重新加载时将填充设置为元素

Question

我成功地从其他两个元素的高度设置了一个元素的填充顶部，我认为一切正常，除了当我调整页面大小时，我需要重新加载它以检索正确的填充值。

这是我的 JQuery 代码:

jQuery(document).ready(function($) {

marge = ($(".items").height() - ($(".picture").outerHeight()*.4))

function resizeBottom() {
    $("div.bottom").css("padding-top", marge + "px" );
};
resizeBottom();

onResize = function() { $("div.bottom").css("padding-top", marge + "px" ); }
});

Answer 1

您需要重新计算调整大小处理程序上的 marge 值

jQuery(document).ready(function ($) {
    onResize = function () {
        var marge = ($(".items").height() - ($(".picture").outerHeight() * .4))
        $("div.bottom").css("padding-top", marge + "px");
    }
    onResize()
});

我希望方法 onResize 被添加为 window 对象的调整大小事件处理程序

另一种写法是

//register the window resize handler
$(window).resize(function () {
    var marge = ($(".items").height() - ($(".picture").outerHeight() * .4))
    $("div.bottom").css("padding-top", marge + "px");
}).resize()