jquery等高插件添加边距答案

【问题标题】：jquery equal height plugin adding marginjquery等高插件添加边距
【发布时间】：2011-12-14 05:24:55
【问题描述】：

如果 DIV 有任何 margin-top/margin-bottom，我将如何添加到下面的代码中？我目前的情况是我有 2 列（DIV），1 列有边距顶部，而另一列没有，这导致列无法正确排列。

抱歉，代码已被缩小，我丢失了原始代码。

$.fn.equalHeight = function (a) {
    var b = {
        delay: 100,
        minusHeight: 0
    };
    var a = $.extend(b, a);
    var c = 0;
    var d = 0;
    var e = $(this);
    setTimeout(function () {
        e.each(function () {
            c = $(this).outerHeight();
            d = c > d ? c : d
        });
        return e.each(function () {
            var b = $(this);
            var c = d - (b.outerHeight() - b.height()) - a.minusHeight;
            var e = jQuery.browser.msie && jQuery.browser.version < 7 ? "height" : "min-height";
            b.css(e, c + "px")
        })
    }, a.delay)
};

【问题讨论】：

标签： jquery jquery-plugins

【解决方案1】：

您应该将true 作为参数添加到.outerHeight()，以便在计算中包含边距。

但是您的代码还有另一个问题..您无法从超时返回任何内容，并且您似乎已将返回代码放在那里..

这意味着你正在破坏 jQuery 链接系统..

你的代码应该是

$.fn.equalHeight = function(a) {
    var b = {
        delay: 100,
        minusHeight: 0
    };
    var a = $.extend(b, a);
    var c = 0;
    var d = 0;

    this.each(function() {
        c = $(this).outerHeight(true);
        d = c > d ? c : d;
    });
    return this.each(function() {
        var b = $(this);
        var c = d - (b.outerHeight(true) - b.height()) - a.minusHeight;
        var e = (jQuery.browser.msie && jQuery.browser.version < 7) ? "height" : "min-height";
        setTimeout( function(){
            b.css(e, c + "px");
        }, a.delay);
    });
};

http://jsfiddle.net/gaby/DXHtk/的演示

【讨论】：

【解决方案2】：

您可以使用 jQuery 的 css() 函数检查 div 的边距。不幸的是，不支持像 margin 这样的速记 css 属性，您必须以 css('marginTop')、css('marginBottom') 等的形式进行操作。然后，您可以有条件地修改每个 div 使其对齐。

【讨论】：