преобразование JQuery в MooTools на небольшой скрипт, который выравнивает высоту

Question

У меня есть этот небольшой скрипт, который делает поля равными по высоте, которые я все время использую в jQuery, которые мне нужно конвертировать в mootools для сайта. в этом примере ящики будут смещены в три раза с таблицами стилей.

<div id="box1" class="equals">content here</div>
<div id="box2" class="equals">content here</div>
<div id="box3" class="equals">content here</div>



       jQuery(document).ready(function(){

var highestCol = Math.max(jQuery('#box1').height(),jQuery('#box2').height(),jQuery('#box3').height());
 jQuery('.equals').height(highestCol);
                        });

Answer 1

, вероятно, лучше сделать его модульным и многоразовым:

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

equalElements(document.getElements("div.equals"));

http://jsfiddle.net/dimitar/TxtBQ/

Answer 2

Есть плагин, который может выравнивать высоту / ширину, установить, если он должен изменить размер до самого большого / наименьшего элемента: http://jsfiddle.net/oskar/5uQEP/

Довольно простое использование:

document.getElements('li').equalize({
    dir: 'height',
    mode: 'max'
});

Вы также можетевернуть необработанное значение и сделать анимацию:

var maxHeight = document.getElements('li').equalize({
    dir: 'height',
    mode: 'max',
    raw: true
});

document.getElements('li').tween('height', maxHeight);

Answer 3

window.addEvent('domready', function(){
  var highestCol = Math.max($('box1').getSize().y, $('box2').getSize().y, $('box3').getSize().y);
  $$('.equals').setStyle('height', highestCol);
}