由于javascript,@ font-face无法加载某些请求？

Question

有一个奇怪的问题,

我正在测试webfonts

这是我的CSS

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Open Sans'), local('OpenSans'), url(/assets/opensans.woff) format('woff');
}

我在整个应用程序中使用该字体,并且在一个页面上没有任何问题.我在这个页面上有相当数量的JS,JS定位元素并设置正确div的高度.

在一些请求上webfont没有加载(根本)

例如

我可以在Windows 7上的chrome上重现这个.但有时候只是.

那些盒子应该是文本,你可以看到的文字是我没有使用@ font-face的地方.

我有javascript事件绑定到窗口调整大小,改变右div的宽度高度.有趣的是,当我调整窗口大小时,字体似乎加载.

我在控制台或chrome上的网络选项卡中看不到任何错误.

它失去了可能性.

Answer 1

这是 Chrome 的一个已知错误。已经修复了，还等更新吗？

或者你可以通过CSS（取自错误报告）强制重新绘制，这应该显示字体：

body
{
    -webkit-animation-duration: 0.1s;
    -webkit-animation-name: fontfix;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 0.1s;
}

@-webkit-keyframes fontfix{
    from{   opacity: 1; }
    to{ opacity: 1; }
}

或JS：

var body = document.getElementByTag("body")[0];
var disp = body.style.display;
body.style.display = 'none';
body.style.display = disp;

jQuery：

$(function() { $('body').hide().show(); });