Skip to content

Instantly share code, notes, and snippets.

@jonathantneal
Created January 4, 2014 05:59
Show Gist options
  • Save jonathantneal/8252231 to your computer and use it in GitHub Desktop.
Save jonathantneal/8252231 to your computer and use it in GitHub Desktop.
onFontReady, a 653 byte function that fires a callback after a font has loaded.
function onFontReady() {
var
fonts = [].slice.call(arguments),
callback = fonts.pop(),
element = document.documentElement.appendChild(document.createElement('x'));
element.setAttribute('style', 'clip:rect(0 0 0 0);font:9px _,serif;position:absolute');
element.innerHTML = ' ';
var lastOffset = element.offsetWidth;
element.innerHTML += '<style>@font-face{font-family:_;src:url(data:font/ttf;base64,AAEAAAAKAIAAAwAgT1MvMiW9IsAAAAEoAAAAYGNtYXAAPwEJAAABkAAAADxnbHlmFiY2OAAAAdQAAAAYaGVhZPmD8i4AAACsAAAANmhoZWEC8P8JAAAA5AAAACRobXR4AAIAAAAAAYgAAAAIbG9jYQAMAAwAAAHMAAAABm1heHAABAAEAAABCAAAACBuYW1lAAYAAAAAAewAAAAGcG9zdAADAAAAAAH0AAAAIAABAAAAAQAANDQG4V8PPPUAAAPoAAAAAM0H14AAAAAAzWfZ0AAAAAAAAQABAAAAAAACAAAAAAAAAAEAAALu/wYAAAABAAAAAAABAAAAAAAAAAAAAAAAAAAAAAACAAEAAAACAAQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAgAAAZAABQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAICAgIAAAACAAoALu/wYAAAL1APoAAAABAAAAAAAAAAAAAAAAAAAAAQAAAAEAAAAAAAEAAwABAAAADAAEADAAAAAIAAgAAgAAACAALQCg//8AAAAgAC0AoP///+H/1P9hAAEAAAAAAAAAAAAAAAwADAAAAAEAAAAAAAEAAQADAAA1MxUjAQEBAQAAAAAAAAAGAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==)}</style>';
function init() {
if (element.offsetWidth !== lastOffset) {
element.style.fontFamily = fonts+',_';
load();
} else setTimeout(init);
}
function load() {
if (element.offsetWidth) {
document.documentElement.removeChild(element);
callback.call(this, fonts);
} else setTimeout(load);
}
init();
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment