3

I have a situation where I’m using Data-URIs to load fonts and only want to use one file type, WOFF. It’s also critical that a fallback font is not used so I’m looking for a way to detect if WOFF is supported with JavaScript. Is it possible to detect WOFF (not WOFF2) support?

This question has been asked before (Detecting with Javascript whether a Browser supports Web Open Font Format (Woff) or not) but the answers given and accepted were not about detecting WOFF support.

Community
  • 1
  • 1
James
  • 399
  • 1
  • 2
  • 10

1 Answers1

3

It looks like the only browsers that don't support WOFF are IE 8, Opera Mini, and Android before 4.3: http://caniuse.com/#feat=woff

Then you can check for IE8 by seeing if addEventListener exists and Opera Mini by seeing if operamini exists:

// from http://stackoverflow.com/a/19572784/4338477
function getAndroidVersion(ua) {
    ua = (ua || navigator.userAgent).toLowerCase(); 
    var match = ua.match(/android\s([0-9\.]*)/);
    return match ? match[1] : false;
}

if ((document.all && !document.addEventListener) || 
        (!!window['operamini']) || 
        (parseFloat(getAndroidVersion() < 4.4)) {
    // IE 8, Opera Mini, Android 4.3 or lower: No WOFF support
} else {
    // Supports WOFF
}
ratherblue
  • 2,108
  • 11
  • 14
  • What about earlier versions of Android? – James Nov 10 '15 at 20:45
  • It should check anything less than 4.4. The other answers in http://stackoverflow.com/a/19572784/4338477 go over different detection edge cases if that doesn't work – ratherblue Nov 10 '15 at 20:53