Browser & OS Detection Add Class HTML Elements


function addUserAgentClass(keywords) {
    for (var i = 0; i < keywords.length; i++) {
        if (navigator.userAgent.indexOf(keywords[i]) != -1) {
            $("html").addClass(keywords[i].toLowerCase());
            return; //Once we find and process a matching keyword, return to prevent less "specific" classes from being added
        }
    }
}

addUserAgentClass(["Chrome", "Firefox", "MSIE", "Safari", "Opera", "Mozilla"]); //Browsers listed generally from most-specific to least-specific
addUserAgentClass(["Android", "iPhone", "iPad", "Linux", "Mac", "Windows"]); //Platforms, also in order of specificity

Comments

Post a Comment

Popular posts from this blog

Bootstrap CSS Customize with SCSS CSS

Using Bootstrap with Bower First let's make a  package.json file for Node to see. Either use npm init -y or create a package.json file containing just an empty JSON object ( {} ). Now let's install gulp , gulp-bower , and gulp-sass : $ npm install --save-dev gulp gulp-bower gulp-sass Now let's use Bower to install bootstrap. This will allow us to import Bootstrap into our SCSS code and compile it down to CSS manually. Create a bower.json file using bower init or by manually creating one: Now let's install bootstrap-sass with Bower. $ bower install --save bootstrap-sass Create One file Now we can make an SCSS file that includes bootstrap into our project. Let's call our SCSS file css/app.scss : @ import "bootstrap" ; @ import "bootstrap/theme" ; Now let's use gulp to compile our app.scss , which includes Bootstrap SASS: Create On JS File with gulpfile.js var gulp = require ...
Read more

Best way to prevent page scrolling on drag (mobile)

 window.onmousedown= function (e) {            if (isTouchDevice()) {                 $(document).on('touchstart', function (e) {                     e.preventDefault();                 });             } }  window.onmouseup = function (e) {     $(document).off('touchstart'); }
Read more

Script to find all fonts used on a page

function styleInPage ( css , verbose ){ if ( typeof getComputedStyle == "undefined" ) getComputedStyle = function ( elem ){ return elem . currentStyle ; } var who , hoo , values = [], val , nodes = document . body . getElementsByTagName ( '*' ), L = nodes . length ; for ( var i = 0 ; i < L ; i ++){ who = nodes [ i ]; if ( who . style ){ hoo = '#' +( who . id || who . nodeName + '(' + i + ')' ); val = who . style . fontFamily || getComputedStyle ( who , '' )[ css ]; if ( val ){ if ( verbose ) values . push ([ hoo , val ]); else if ( values . indexOf ( val )== - 1 ) values . push ( val ); } val_before = getComputedStyle ( who , ':before' )[ css ]; if ( val_before ){ if ( verbose ) values . push ([ hoo , va...
Read more