CODEWITHSUNDEEP
javascriptjqueryfont-face
Computer User
Computer User

Reputation: 546

jQuery - Detect when custom font has loaded?

I need to measure the navigation of my site to determine the space available for a feature I am building. I recently added a custom font...

The trouble is that I measure the navigation before the new font is loaded. The new font then loads altering the width of the navigation. I am then left with an incorrect width.

Is there a way I can determine when the font has loaded with JavaScript. I am using CSS to load the font.

Upvotes: 3

Views: 3366

Answers (1)

Richard Parnaby-King
Richard Parnaby-King

Reputation: 14882

I assume you are waiting on $(document).load before running your jquery? This just waits for the DOM to become accessible. If you want to wait until the entire webpage (and associated files) are ready, use $(window).load:

$(window).bind("load", function() {
       //nav resize code here
});

I wouldn't wrap your entire code in this, just the part that is dependent on the fonts.

Upvotes: 2

Related Questions