lte-IE7.js doesn't work if you import icon font via Javascript.

155 views
Skip to first unread message

Dan Bohea

unread,
Sep 15, 2013, 6:25:27 AM9/15/13
to ico...@googlegroups.com
Due to a bug in the Selectivizr library, I am forced to import web fonts either via JS or by adding the @font-face declaration directly to the HTML's head. For various reasons I'm leaning towards the JS approach and have settled on using Web Font Loader which is working really well.

However, it now seems that the lte-IE7 JS polyfill that IcoMoon provides never kicks in. Any tips on how I can still use this IE fix if I'm importing my web fonts via JS?



PS - the "javascript" tag in this Google Group is misspelled.

Keyamoon

unread,
Sep 15, 2013, 11:47:51 AM9/15/13
to
Perhaps if I explain how the lte-ie7.js works, it might help you make it work. It goes through the DOM and finds any element with an "icon-" class and then inserts proper HTML entities inside it. Therefore, if the document has not yet finished loading, it won't work.

lte-ie7.js file is currently using window.onload, but if you're using your own custom setup and want to load it via js, you should change it to a self invoking anonymous function like this:

(function() {
function addIcon(el, entity) {
var html = el.innerHTML;
el.innerHTML = '<span style="font-family: icomoon'">' + entity + '</span>' + html;
}
       /* and the rest of the code... */
}());

I hope this helps.

Dan Bohea

unread,
Sep 15, 2013, 11:45:44 AM9/15/13
to ico...@googlegroups.com
That's jolly helpful, thank you.

I had a feeling that it may be an issue of timing & order and I'd just about figured out roughly how the script was working. Your reply pretty much confirms this and I'm now gonna see if I can can get it to work. Oh no, hang on. It's IE7, maybe it can wait.... :D
Reply all
Reply to author
Forward
0 new messages