2

我的最新项目出现了一个奇怪的错误。它还没有推出，所以我不能分享（因为与我公司的合同义务），但这里有一些细节：

  • 通过 iFrame 的 Facebook 页面
  • 问题似乎仅在 IE7-8 中
  • 使用自定义 @font-face 字体
  • 无法在 VirtualBox 上重现问题
  • 在相同浏览器中从 Facebook 打开页面时，问题未重现（Facebook 促成了该问题）

问题是当页面最初在 IE7-8 中加载时字体加载正常，当用户转到内部页面时，所有@font-face 字体都恢复为它们的网络安全字体备份。它们将保持这种状态（甚至返回加载字体的第一页），直到缓存被清除。字体在 Chrome 和 Foxy 的同一台测试机器上加载并保持加载。

我在这里发现了这个错误，Facebook JS 影响 IE 中的 CSS/@font-face？，但它建议使用 iFrame 版本应该可以解决问题，我们正在使用 iFrame 版本。

有人有想法么？

4

1 回答 1

1

这是 IE8(?) 错误。您需要在页面加载后重新加载 CSS 样式表。

将 ID 添加到您的链接元素：

<link rel="stylesheet" href="css/style.css" id="css-element" />

然后（使用jQuery）：

$(document).ready(function() {
    $('#css-element')[0].href=$('#css-element')[0].href;
});

...或使用 Modernizr 功能（不在每个浏览器中重新加载）：

$(document).ready(function() {
    if ($('html.lte-ie9').length > 0)
    {
        $('#css-element')[0].href=$('#css-element')[0].href;
    };
});

编辑：另见：IE8 web font iframe bug workarounds

于 2012-09-07T10:17:23.140 回答