Skip to content

Instantly share code, notes, and snippets.

@llakewood
Last active June 14, 2017 19:34
Show Gist options
  • Save llakewood/2778459bd5c49b96ee7258f3bc67b71c to your computer and use it in GitHub Desktop.
Save llakewood/2778459bd5c49b96ee7258f3bc67b71c to your computer and use it in GitHub Desktop.
htmlClasses - Uses Bowser and DOM info to apply useful classes to the <html> element
var bp = 1000
//htmlClasses - Uses Bowser and DOM info to apply useful classes to the html tag
(function () {
var browserWidth = (whatWidth() > bp + 1 ? { "desktop" : true, "handheld" : false } : { "desktop" : false, "handheld" : true } );
var browserOrientation = (whatOrientation() > 0 ? { "landscape" : true, "portrait" : false } : { "portrait" : true, "landscape" : false } );
var protocol = (window.location.protocol === "https:" ? { "https" : true, "http" : false } : { "https" : false, "http" : true } );
var browserInfo = {},
htmlClasses = {},
htmlClass;
browserInfo.chrome = (bowser.chrome ? true : false);
browserInfo.mac = (bowser.mac ? true : false);
browserInfo.tablet = (bowser.tablet ? true : false);
browserInfo.iphone = (bowser.iphone ? true : false);
browserInfo.ipod = (bowser.ipod ? true : false);
browserInfo.ipad = (bowser.ipad ? true : false);
browserInfo.safari = (bowser.safari ? true : false);
browserInfo.windows = (bowser.windows ? true : false);
browserInfo.msie = (bowser.msie ? true : false);
browserInfo.webkit = (bowser.webkit ? true : false);
browserInfo.ios = (bowser.ios ? true : false);
browserInfo.android = (bowser.android ? true : false);
browserInfo.mobile = (bowser.mobile ? true : false);
browserInfo.firefox = (bowser.firefox ? true : false);
jQuery.extend(htmlClasses, browserInfo, browserOrientation, browserWidth, protocol);
for(htmlClass in htmlClasses) {
if(htmlClasses[htmlClass]) {
jQuery('html').addClass("my-" + htmlClass);
} else {
jQuery('html').removeClass("my-" + htmlClass);
}
}
})();
//whatWidth - return the current window width
function whatWidth(w) {
return jQuery( window ).width();
}
//whatOrientation - return the current window orientation
function whatOrientation() {
var orientation,
w = window;
if(w.screen) {
if(w.screen.orientation) {
orientation = w.screen.orientation.angle;
} else {
orientation = w.orientation;
}
} else {
orientation = w.orientation;
}
return orientation;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment