如何等待网络字体加载？

Question

我有一个使用webfonts的canvas元素。即使我使用jquery的onload方法($(function () {});)，当onload运行时字体仍然可能无法使用--有时我的画布不会渲染文本，有时则完全正常。

我是否可以传递某种回调来运行google webfonts加载完成后的操作？

- TheOne

Answer 1

如果您通过“WebFont Loader”（由Google和Typekit使用）嵌入字体，您可以订阅“active”事件。所有字体加载完成后，该事件将被触发。请查看文档：https://developers.google.com/webfonts/docs/webfont_loader#Events。

- philipproplesch

Answer 2

尝试使用窗口加载监听器。它会在图形、CSS、Web字体等加载完成后触发。

http://api.jquery.com/load-event/

当页面完全加载，包括图形时运行一个函数。

$(window).load(function() {
    //do something
});

http://jsfiddle.net/kwLf9/1/

- Robin Drexler