Detect browser using appCodeName and load some css

Question

I wanted to detect browser & then i need to load css files according to the browser.For this i use following javascript.But problem is any browser i use it shows the Mozilla as a code name.

<script type="text/javascript">
browsername=navigator.appCodeName;
alert(browsername); //<- always alert Mozilla if i run in IE or Safari
</script>

The second thing is If browser is IE then i need to load some css.

score 0 · Answer 1 · answered Feb 12 '14 at 17:58

You can use conditional comments to load CSS files:

<p class="accent">
<!--[if IE]>
According to the conditional comment this is IE<br />
<![endif]-->
<!--[if IE 6]>
According to the conditional comment this is IE 6<br />
<![endif]-->
<!--[if IE 7]>
According to the conditional comment this is IE 7<br />
<![endif]-->
<!--[if IE 8]>
According to the conditional comment this is IE 8<br />
<![endif]-->
<!--[if IE 9]>
According to the conditional comment this is IE 9<br />
<![endif]-->
<!--[if gte IE 8]>
According to the conditional comment this is IE 8 or higher<br />
<![endif]-->
<!--[if lt IE 9]>
According to the conditional comment this is IE lower than 9<br />
<![endif]-->
<!--[if lte IE 7]>
According to the conditional comment this is IE lower or equal to 7<br />
<![endif]-->
<!--[if gt IE 6]>
According to the conditional comment this is IE greater than 6<br />
<![endif]-->
<!--[if !IE]> -->
According to the conditional comment this is not IE 5-9<br />
<!-- <![endif]-->
</p>

And here's some code to detect the browser using JavaScript:

navigator.sayswho = (function () {
    var N = navigator.appName,
        ua = navigator.userAgent,
        tem;
    var M = ua.match(/(opera|chrome|safari|firefox|msie)\/?\s*(\.?\d+(\.\d+)*)/i);
    if (M && (tem = ua.match(/version\/([\.\d]+)/i)) != null) M[2] = tem[1];
    M = M ? [M[1], M[2]] : [N, navigator.appVersion, '-?'];

    return M;
})();

Example: http://jsfiddle.net/32cj6/

IE10 (or maybe 11) stops paying attention to conditional comments. — Colin DeClue, Feb 12 '14 at 18:16

score 0 · Answer 2 · answered Feb 12 '14 at 18:04

there are also html tags to check for IE:

    <!--[if IE]>
         <link rel="stylesheet" type="text/css" href="internet_explorer_styling.css" />
    <![endif]-->

and ofcourse you can also use javascript for that. Use the following code:

navigator.userAgent

or

navigator.appVersion

if you use javascript for this, then you should check if 1 of those strings contains chrome, firefox, opera or ie (ie = msie)

Hope this will help you!

Good luck!

score 0 · Answer 3 · edited May 23 '17 at 12:29

"Some browsers misidentify themselves to bypass site tests": http://www.w3schools.com/js/js_window_navigator.asp

Try taking a look at this also:
Browser detection in JavaScript?

To have IE specific css then you can do something like this in the head with either inline css or a linked stylesheet:

<!--[if IE]>
  <style type="text/css">
    .selector {
      color: #000;
    }
  </style>
  <link rel="stylesheet" href="IEstyle.css">
<![endif]-->

You can also do specific IE version, for example [if lte IE9] would be if less than or equal to IE9. [if gt IE9] would be if greater than IE9, and so on.

score 0 · Answer 4 · answered Feb 12 '14 at 18:07

i do a check for IE with document.documentMode!=undefined document.documentMode shows at which version IE is running. but you can also look for (ScriptEngine()=="JScript") there are a lot more of IE signifancts for example Enumerator is defined in JScripts which lets go through The Data File System ActiveXObject is defined in JScript

if (typeof Enumerator=="function" && typeof ActiveXObject=="function") you have IE and so n

Detect browser using appCodeName and load some css

4 Answers4