Context-based loading JavaScript using CSS media query breakpoints

conditional-css-inc-ie.html

<script type="text/javascript">
    var LegacyIE = {
      Version: function() {
        var version = 999;
        if (navigator.appVersion.indexOf("MSIE") != -1)
          version = parseFloat(navigator.appVersion.split("MSIE")[1]);
        return version;
      }
    }
    if (LegacyIE.Version() <= 8) {
        // Do something only in large contexts (and if the browser doesn't recognise CSS :after)
    } else {
        var size = window.getComputedStyle(document.body,':after').getPropertyValue('content');
        if (size.indexOf("small") !=-1) {
            // Do something only in small contexts
        }
        if (size.indexOf("medium") !=-1) {
            // Do something only in medium contexts
        }
        if (size.indexOf("large") !=-1) {
            // Do something only in large contexts
        }
    }
</script>