1

我已经修改了尝试加载三种谷歌字体的其他人的代码。

他们有 3 个 css 文件。每个 css 文件都使用了 google web fonts 中的一种 css 字体。在 chrome 开发工具中,我只看到一种字体有效,而另两种无效。

发生这种情况是因为只有一个可以应用,所以 chrome 试图下载一个。当他们更改下拉选择更改的字体时,它不起作用,因为字体甚至没有在 chrome 中加载。

因为我想在他们更改下拉列表时加载字体,所以我编写了以下代码:

<div id="hiddenFontLoader"></div>

CSS:

#hiddenFontLoader {
    font-family: 'Quicksand', 'Cantarell';
    display: none;
}

此代码帮助我加载其他 2 种无处使用的字体,并将在下拉更改时使用。

现在我想证明它是有效的。对我来说,我可以将字体设置为 400% 并且可以检查它是否有效。

测试字体是否加载的正确方法是什么。我的意思是如果我使用后备字体,那么我无法检查所有字体是否有非常小的差异,并且后备字体与我从谷歌字体加载的字体非常相似。

假设我申请了 body{} 那么如何确认它在 chrome 开发工具或 firebug 中工作。

任何人都有诀窍。

4

1 回答 1

3

您应该考虑使用Google WebFont Loader。文档非常详尽。具体来说,查看Acting on Events.

https://developers.google.com/webfonts/docs/webfont_loader

我相信您正在寻找active 活动 (单击此处!)

于 2013-01-02T17:33:49.680 回答