WebGL Javascript Detection

webgl-detect.js

// JQuery only used for selecting and removing elements,
// mostly left in for the below ALERT.
// the console.log statements are for your sanity checks.

var asa; var canvas; var dcanvas; var gl; var expmt;

canvas = $('#my-canvas');
console.log(canvas);

// check to see if we can do webgl
// ALERT FOR JQUERY PEEPS: canvas is a jquery obj - access the dom obj at canvas[0]
    dcanvas = canvas[0];
    expmt = false;
    if ("WebGLRenderingContext" in window) {
        console.log("browser at least knows what webgl is.");
    }
    // some browsers don't have a .getContext for canvas...
    try { gl = dcanvas.getContext("webgl"); }
    catch (x) { gl = null; }
    if (gl == null) {
        try { gl = dcanvas.getContext("experimental-webgl"); }
        catch (x) { gl = null; }
        if (gl == null) { console.log('but can\'t speak it'); }
        else { expmt = true; console.log('and speaks it experimentally.'); }
    } else {
        console.log('and speaks it natively.');
    }

    if (gl || expmt) {
        console.log("loading webgl content.");
    } else {
        console.log("image-only fallback. no webgl.");
        canvas.remove();
    }

});