Skip to content

Instantly share code, notes, and snippets.

@nathansmith

nathansmith/#1 example.css

Last active August 29, 2015 14:04
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save nathansmith/fe48910e1984e54460bc to your computer and use it in GitHub Desktop.
Save nathansmith/fe48910e1984e54460bc to your computer and use it in GitHub Desktop.
Download ZIP
JS to detect non-IE browsers. IE10 & IE11 throw false positives about "preserve 3D" CSS transforms.
Raw
#1 example.css
.not-IE .foobar {
/*
3D CSS transforms here.
*/
}
Raw
#2 detectIE.js
define(function(require) {
'use strict';
/*
Some backwards IE detection.
Necessary due to IE10, IE11.
Used like this...
var detectIE = require('detectIE');
detectIE();
*/
return function() {
var d = document.documentElement;
// IE document mode, if it exists.
var mode = document.documentMode;
// Get current body class.
var className = d.className;
// Regex for class="not-IE".
var r = /not-IE/g;
// Does it already have class="not-IE"?
var hasClass = className && className.match(r);
if (!hasClass) {
className = className.split(' ');
className.push('not-IE');
className = className.join(' ');
className = $.trim(className).replace(/\s+/g, ' ');
d.className = className;
}
// Remove "not-IE" class from <body>, if it is IE.
function isIE() {
d.className = d.className.replace(r, '');
}
// IE10 and older.
/*@cc_on@*/
/*@
isIE();
@*/
// IE11.
if (mode === 11) {
isIE();
}
};
});
@nathansmith
Copy link
Author

Note: This shouldn't be considered a best practice. Think of it as a last resort.

Suggested reading…

http://adrianba.net/archive/2012/12/20/pretending-browser-detection-isnt-browser-detection.aspx

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment