Применить шрифт CSS перед выполнением JS

Question

Я создаю веб-приложение, которое использует поверхность холста поверх тела HTML. Я использую холст для рисования границы вокруг SPAN. Он работает почти идеально, но у меня все еще есть проблема с загрузкой страницы.

Я использовал хром-отладчик и заметил, что стиль шрифта из css-файла применяется после выполнения сценария, который смущает метод DOM getElementRects и приводит к тому, что граница пропусков не установлена, после того как страница полностью отображена. Ниже я прикрепляю скриншоты.

У вас есть какие-либо идеи, как решить это? Могу ли я ждать, пока стиль CSS не будет полностью применен?

Answer 1

шрифт загрузка занимает больше времени, чем CSS загрузки тейк помощью следующих ->How to be notified once a web font has loaded

Answer 2

Is $(document).ready() also CSS ready?

Готовый() метод больше не пытается сделать какие-либо гарантии относительно ждет все таблицы стилей, которые будут загружены. Вместо этого все CSS-файлы должны быть включены перед скриптами на странице. Дополнительная информация

Убедитесь, что ваши скрипты находятся внизу страницы html.