Free Online Courses for Software Developers - MrBool
× Please, log in to give us a feedback. Click here to login
×

You must be logged to download. Click here to login

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

How to identify the version of Internet Explorer with Javascript and jQuery

In this article we will see how you can identify the version of IE of every user that visits your site. I will show you how to do this with javascript and jQuery.

Hello guys, today I'll share a "quick-tip" with you. The article will be very small, but hopefully it will be very useful to our readers.

In today's article I will show you how to identify which version of IE your user is using.

Let the code:

Listing 1: Javascript Code

<script type="text/javascript">
if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) {
 var ieversion=new Number(RegExp.$1)
 if (ieversion>=8)
     // for IE8
     document.getElementsByTagName('html')[0].className+='ie8';
 else if (ieversion>=7)
     // for IE7
     document.getElementsByTagName('html')[0].className+='ie7';
 else if (ieversion>=6)
     // for IE6
     document.getElementsByTagName('html')[0].className+='ie6';
}
</script>

Listing 2: jQuery Code

if ($.browser.msie) {
    if(parseInt($.browser.version) == 8){
         // for IE8
         $("html").addClass("ie8");
    } else if(parseInt($.browser.version) == 7){
         // for IE7
         $("html").addClass("ie7");
    } else if(parseInt($.browser.version) == 6){
         // for IE6
         $("html").addClass("ie6");
    }
}

Besides these two options, there are conditional comments in html and CSS. This option ends "dirtying" the code a bit, but I'll provide the code to help those who prefer to use.

Listing 3: Conditional Comment with CSS

<!--[if IE 6]>
<html lang="pt-br" class="ie6">
<![endif]-->
 
<!--[if IE 7]>
<html lang="pt-br" class="ie7">
<![endif]-->
 
<!--[if IE 8]>
<html lang="pt-br" class="ie8">
<![endif]-->
 
<!--[if gte IE 8]>
<html lang="pt-br" class="ie9">
<![endif]-->
 
<!--[if !IE]><!-->
<html <http://december.com/html/4/element/html.html> lang="en-us">
<!--<![endif]-->

In this case if you choose to use conditional comments you have to stylize these classes using the Specific .css for each browser.

Note: In the case of conditional comments I recommend creating a css file for each specific browser, the code is cleaner and easier to edit.

Listing 4: Conditional Comment with Specific CSS

<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->
 
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="ie7.css" />
<![endif]-->
 
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="ie8.css" />
<![endif]-->
 
<!--[if gte IE 8]>
<link rel="stylesheet" type="text/css" href="ie9.css" />
<![endif]-->
 
<!--[if !IE]><!-->
<link <http://december.com/html/4/element/link.html> rel="stylesheet" type="text/css" href="application.css" />
<!--<![endif]-->

Well folks, hope you enjoyed the article and that it will be useful to you, as it is useful for me :)

See you next time.

Ricardo Arrigoni - Front-end Developer



Front-end developer, WebEditor of MrBool.com and SEO Analyst. Work in the development area for over 4 years. For freelance work visit my portfolio: www.ricardoarrigoni.com.br

What did you think of this post?
Services
[Close]
To have full access to this post (or download the associated files) you must have MrBool Credits.

  See the prices for this post in Mr.Bool Credits System below:

Individually – in this case the price for this post is US$ 0,00 (Buy it now)
in this case you will buy only this video by paying the full price with no discount.

Package of 10 credits - in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download few videos. In this plan you will receive a discount of 50% in each video. Subscribe for this package!

Package of 50 credits – in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download several videos. In this plan you will receive a discount of 83% in each video. Subscribe for this package!


> More info about MrBool Credits
[Close]
You must be logged to download.

Click here to login