forked from javascript-tutorial/server
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathfontTest.js
More file actions
executable file
·34 lines (27 loc) · 1.29 KB
/
fontTest.js
File metadata and controls
executable file
·34 lines (27 loc) · 1.29 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
/*
Избегаем FOUT - простой способ проверки загрузки иконик шрифта.
1) Делаем в iconic шрифте один символ с кодом 21 (вместо «!»)
В iconmoon
http://ilyakantor.ru/screen/2014-09-06_0152.png
http://ilyakantor.ru/screen/2014-09-06_0153.png
Этот шрифт в обычном шрифте (serif) узкий по ширине, а в iconic - нормальный.
2) Далее при загрузке создаём <span>!</span> и даём ему fontFamily сначала serif и замеряем ширину, а потом FontIcons, serif.
Отлавливаем момент, когда ширина изменится. Это значит шрифт загружен.
Можно убрать класс .no-icons и показать иконки.
*/
module.exports = function() {
let elem = document.createElement('span');
document.body.appendChild(elem);
elem.className = 'font-test';
elem.style.fontFamily = 'serif';
let initialWidth = elem.offsetWidth;
elem.style.fontFamily = '';
function checkFontLoaded() {
if (initialWidth != elem.offsetWidth) {
document.body.classList.remove('no-icons');
} else {
setTimeout(checkFontLoaded, 100);
}
}
checkFontLoaded();
};