Question

I have at the moment in this JsFiddle code snippet 3 tables, the central table is named .sl_scrollingTable and the others .sl_NewFixedTable.

What I am trying to do is have each row have the same height on all three tables. It works for the first instance of .sl_NewFixedTable but not for the second. Not sure why, please help.

Answer 1

You can use John Resig’s Array.min and Array.max from his blog

I’ve updated your jsfiddle: http://jsfiddle.net/2uux2/1/

But, here’s the code for anyone else to look at.

// document onload
Array.max = function( array ){
    return Math.max.apply( Math, array );
};
Array.min = function( array ){
    return Math.min.apply( Math, array );
};

var h= $('tr').map(function() {
        return $(this).height();
}).get();

var maxHeight = Array.max(h);
console.log('Max height: ' + maxHeight );

$('tr').css({height:maxHeight });