jquery.equalheights.js

[jcw2m]

Has anyone successfully applied this tool to columns? General usage is given as:
* Usage: $(object).equalHeights([minHeight], [maxHeight]);
*
* Example 1: $(".cols").equalHeights(); Sets all columns to the same height.
* Example 2: $(".cols").equalHeights(400); Sets all cols to at least 400px tall.
* Example 3: $(".cols").equalHeights(100,300); Cols are at least 100 but no more
* than 300 pixels tall. Elements with too much content will gain a scrollbar.
*

The thing is Able names it’s classes more like #mainColumn, #rightColumn, .column_1, .column_2, .column_3, etc. I have to be missing something regarding actually using the tool. It does not look like the layout files and classes are structured in a way that it could be easily implemented without a lot of changes. Thoughts/feedback would be much appreciated!

Thanks!
jc@w2m

[jmestep]

You could try adding class="cols" in the html for the column tags- that looks like what the jQuery is looking for (.cols)

[jguengerich]

The Checkout\ShipMethod.aspx page uses it (the last code on the page).

EDIT: the string "equalheights" appears in the following pages:
Admin/Admin.Master.cs
Admin/Orders/ViewOrder.aspx
Checkout/GiftOptions.aspx
Checkout/ShipAddresses.aspx
Checkout/ShipMethod.aspx
Layouts/Base.Master.cs
Layouts/Fixed/Base.Master.cs
Mobile/Checkout/GiftOptions.aspx
Scripts/jquery.equalheights.js

[jcw2m]

Thanks - I will definitely check that out! Not every design requires this but it looks like a handy tool for those that do. It's better than using old school overstated padding rules.