jQuery working out wrong height, due to @font-face

Question

I have a problem with jQuery and @font-face.

I need to work out the height of a <div>, which works fine, but then there is a small delay for the fonts to load and as soon as they do, the @font-face fonts were actually bigger than the fallback fonts, so the height is smaller than it should be.

I have tried using Modernizr, but that is no use as it only detects if the browser is capable of @font-face, not whether the fonts have loaded yet or not.

The jQuery code is in $(document).ready, but I guess fonts don't delay that from firing. Any ideas anyone?

Answer 1

The perfect solution was, as Adam pointed out, using $(window).load instead of $(document).ready

$(window).load(function(){  
  $(".column").equalHeights();
});