@fontface之前的默认字体闪烁显示在IE中

在加载@ font-face webfont的同时停止IE显示默认字体的最佳方式是什么？该页面加载了ajax，并将css文件加载到头部。这个问题可以在http://www.peterharveyco.com.au/上查看，然后点击其中一个滚动项目。从我读过的内容，我正确加载字体以避免这样的问题。它只是加载我设置为备份字体的任何东西，直到它准备好。是设置紧密备份字体的唯一解决方案吗？我可以没有任何存在，直到它准备好，如果这是可能的...@fontface之前的默认字体闪烁显示在IE中

任何帮助将不胜感激。

CSS文件：

@font-face { 
    font-family: 'TradeGothicLTStdBdCnNo.20'; 
    src: url('tradegothicltstd-bdcn20-webfont.eot'); 
    src: url('tradegothicltstd-bdcn20-webfont.eot?#iefix') format('embedded-opentype'), 
     url('tradegothicltstd-bdcn20-webfont.woff') format('woff'), 
     url('tradegothicltstd-bdcn20-webfont.ttf') format('truetype'), 
     url('tradegothicltstd-bdcn20-webfont.svg#TradeGothicLTStdBdCnNo.20') format('svg'); 
    font-weight: normal; 
    font-style: normal; 

}

来源

2012-04-10 Dean_Wilson

我确实认为这发生在您有多个具有font-family规则的样式表时。它首先使用任何负载，直到其他样式表（覆盖它）完成下载。但我不是100％确定的。 – animuson 2012-04-10 01:13:58

我会检查一下 - 我确实有多个样式表可能不是最佳的反正......虽然我正在加载@fontface样式表第一个 – 2012-04-10 01:16:49

我想我找到了适合我的特定情况的解决方案/解决方法。主页上未使用该字体。我添加了一个h1作为页面的标题（无论如何它都需要它），并使用-3000px页边距将它隐藏在页面之外。这个明显的问题是，如果用户直接进入项目页面......但是，我刚刚确定，当你直接进入页面时，滑块中的图像不会在IE中显示（例如http： //www.peterharveyco.com.au/projects/austereo-perth - 如果我不能解决这个问题，也许是另一个问题的主题）。 – 2012-04-10 02:00:58

你可以使用谷歌的WebFont loader作为一个自定义的字体来指定@字体面的字体。看起来像你可以在样式表中粘贴@ font-face规则，然后将加载器指向此样式表。然后，您可以使用.wf-loading类将具有自定义@ font-face字体的元素设置为visibility:hidden，以便不显示默认字体。然后使用.wf-active类设置visibility:visible以显示@ font-face字体

来源

2012-04-10 07:49:35 danwellman

I还没有证实这一点（我的解决方法足以让我继续进行其他工作），但这听起来像一个坚实的计划。谢谢。 – 2012-04-10 21:24:29

@fontface之前的默认字体闪烁显示在IE中

回答

相关问题