Simple jquery equalHeight cross browser fix for 960gs
- October 4th, 2009
- Development
- 0 Comment
As the title says, its a simple fix for those who usesĀ 960 grid system. I come across this problem while developing my new wordpress theme which requires an equal height for multiple columns so layout won’t mess up. I don’t know if this is already been posted but anyhow i would like to share how did i fix it.
JQUERY EQUAL HEIGHT CODE:
function equalHeight(group) {
tallest = 0;
extended = 0;
group.each(function() {
thisHeight = $(this).height();
if(thisHeight > tallest) {
tallest = thisHeight;
}
});
group.height(tallest);
}
USAGE:
$(document).ready(function() {
equalHeight($(".recent-article"));
equalHeight($(".footer-col"));
});
but for some reason under 960 grid system the script above did not get the exact height of a column so as the result the layout mess up like hell for google chrome browser and safari.
WHAT DID I DO:
I call the equalHeight function directly on onload function.
window.onload = equalHeight($(".recent-article"));

i really don’t know how to explain this but it really works. hope this helps.



















NO RESPONSE TO "Simple jquery equalHeight cross browser fix for 960gs"