Abhishek
Abhishek

Reputation: 997

How to resize the html table rows

I have two html tables and the contents of both are dynamically generated, both rows are also fixed. I have to adjust the row height for both tables so that both tables and rows height will be with the same height. The situation is that both table’s heights should be adjusted so that the two tables look like a single table. I have below code below, its working fine with Mozilla but not working in IE. Suggest code to work with IE also.

used file : jquery-1.3.2.js

for (rIndex = 1; Number(rIndex) < Number(totalrows); rIndex = Number(rIndex) + 1) {
    var lRowH = $('#tblTopLeft').find("tr").eq(rIndex).height();
    var rRowH = $('#tblRightTop').find("tr").eq(rIndex).height();

    if (Number(lRowH) > Number(rRowH)) {
        $('#tblRightTop').find("tr").eq(rIndex).css('height', $('#tblTopLeft').find("tr").eq(rIndex).css('height'));

    }
    else {
        $('#tblTopLeft').find("tr").eq(rIndex).css('height', $('#tblRightTop').find("tr").eq(rIndex).css('height'));

    }
}

Upvotes: 0

Views: 576

Answers (1)

R Saudlach
R Saudlach

Reputation: 388

First upgrade to a new version of JQuery.

There is functionality called .addClass() and .removeClass()

These are much better to use vs. adding attributes to existing styling.

What you do is create two styling blocks; one before the event happens and one after.

When the event happens, remove the the original styling and add in the new one.

Upvotes: 2

Related Questions