检测字体加载状态以及后备方案的工具
安装
npm install font-loader-observer
使用
-
isSupportFontDisplay()
检测浏览器是否支持 font-display CSS 属性。如果支持可以直接使用原生 CSS 控制字体加载模式 -
watchFontLoaded(String fontFamily, Object options)
如果不支持 font-display,则监听字体加载状态
fontFamily
: 一个字符串,要检测的字体名称options
: 可选项,支持参数:callback
: 字体加载完成的回调函数failed
: 字体加载失败的回调函数timeout
: 字体加载超时时间,单位秒。默认3000defaultFont
: 字体加载完成之前的默认字体referText
: 检测字体加载状态所用的字符串。默认是 "!"\#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[]^_`abcdefghijklmnopqrstuvwxyz{|}~"
if ! documentbodyclassList; else console