height - MooTools を使用して要素の高さを均等にする方法は?

Question

可変数の子 div (2-4) を持つ div があります。

これらの div の高さを、コンテンツが最も多い div (最も高い div) の高さと一致させたいと考えています。

MooTools を使用したことはありませんが、この場合は使用する必要があります。

まず、親 div に含まれる div の数を確認し、すべての高さを取得してから、最大のものを決定し、その高さをすべての子 div に適用する必要があることを知っています。ただし、構文はわかりません。

Answer 1

それほど難しいことではありません。これは、渡された要素を調べ、ロットの最大の高さを選択して、それをすべての要素に適用する小さな関数です。

var equalElements = function(els){
    // make elements equal height to max height of the set.
    var height = Math.max.apply(Math, els.map(function(el){
        return el.getSize().y;
    }));

    els.setStyle('height', height);
};

// pass on a collection of elements
equalElements(document.getElements('div.equals'));

これをElementsプロトタイプに追加することもできます。

Elements.implement({
    equalHeight: function(){
        // make elements equal height to max height of the set.
        var height = Math.max.apply(Math, this.map(function(el){
            return el.getSize().y;
        }));

        this.setStyle('height', height);
    }
});

$$('div').equalHeight();

http://jsfiddle.net/dimitar/h6CAc/を参照してください