jQuery berechnet die falsche Höhe, aufgrund von @font-face

Question

Ich habe ein Problem mit jQuery und @font-face.

Ich muss die Höhe eines <div> was gut funktioniert, aber dann gibt es eine kleine Verzögerung, bis die Schriften geladen sind, und sobald sie geladen sind, sind die @font-face-Schriften tatsächlich größer als die Fallback-Schriften, so dass die Höhe kleiner ist als sie sein sollte.

Ich habe versucht, Modernizr zu verwenden, aber das nützt nichts, da es nur erkennt, ob der Browser @font-face-fähig ist, nicht aber, ob die Schriftarten bereits geladen sind oder nicht.

Der jQuery-Code ist in $(document).ready, aber ich schätze, dass Schriftarten nicht verzögern, dass von Zündung. Irgendwelche Ideen jemand?

Answer 1

Die perfekte Lösung war, wie Adam wies darauf hin, dass die Verwendung von $(window).load 代わりに $(document).ready

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

Answer 2

Die Google font api scheint zu funktionieren, solange Sie Schriften von Google, Typekit oder Ascender laden. Wenn Sie jedoch etwas anderes verwenden (z. B. eine andere Schriftart, die Sie von fontsquirrel heruntergeladen haben), sollten Sie vielleicht etwas wie este um die gerenderte Schriftart herauszufinden. Vielleicht möchten Sie auch diese Diskussion über die Bestimmung der verwendeten Schriftart lesen Ändern der Körperschriftgröße basierend auf der Schriftfamilie mit jQuery

Answer 3

Vielleicht möchten Sie sich die Google Font API ansehen ( http://code.google.com/apis/webfonts/docs/webfont_loader.html ). Ich glaube, es lädt dynamisch die Schriftart und feuert eine Reihe von Ereignissen, die Sie auf (für die Größenänderung Ihrer 's) handeln können.