How to detect IE7 with javascript or jquery and add a class to div

Question

Is there any way to detect IE7?

I don't have any problems with my codes in IE8, but I have a problem with IE7.

So what I thought is that I can add a class with jquery when a browser is IE7 detecting it by javascript.

I want to change from

<div id="system">

to

<div id="system" class="ie7">

Thanks in advance.

Is this issue related to styles or JavaScript? If this is a style-related thing, you should consider using conditional comments like suggested. If this is a JavaScript thing, you should read about feature detection, which beats browser sniffing in a lot of ways. — jwueller
– jwueller, Commented Sep 8, 2010 at 17:12

Alex · Accepted Answer · 2010-09-08 17:10:56Z

49

if you really want to solve this by using javascript you might want to check the version like this:

if (navigator.appVersion.indexOf("MSIE 7.") != -1)
    $('#system').addClass('ie7');

answered Sep 8, 2010 at 17:10

Alex

5,5091 gold badge34 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

klewis Over a year ago

+1 for a solution that does not depend on the available options of a javascript framework, or conditional comments.

Jimmy · Accepted Answer · 2010-09-08 17:07:23Z

10

You could use an IE conditional comment to add the class via javascript, something like this:

<!--[if IE 7]>
<script type="text/javascript">
$(document).ready(function() {
    $('#system').addClass('ie7');
});
</script>
<![endif]-->

answered Sep 8, 2010 at 17:07

Jimmy

5554 silver badges15 bronze badges

Comments

jAndy · Accepted Answer · 2010-09-08 17:15:38Z

9

You can do it just with HTML:

css

.ie7{
   padding: 0;
   color: red;
}

html

<!--[if IE 7 ]> <div id="system" class="ie7"> <![endif]-->
<!--[if (gt IE 7)|!(IE)]><!--> <div id="system"> <!--<![endif]-->
</div>

This creates the div with the class ie7 if executed in internet explorer 7. All other browser and IE > 7 would just create that div without the class.

edited Sep 8, 2010 at 17:15

answered Sep 8, 2010 at 17:07

jAndy

237k57 gold badges313 silver badges363 bronze badges

2 Comments

Todd Moses Over a year ago

I think he is wanting a jQuery solution. However, your solution is a better way to go since a user could have javascript disabled.

bobince Over a year ago

+1. I usually do this in one place, on <body class="ie7">, and use a CSS containment selector like body.ie7 #system, to avoid having to repeat conditional comments throughout the document.

Boro · Accepted Answer · 2012-07-27 09:13:16Z

9

To detect ie7 just use

if($.browser.msie && parseFloat($.browser.version) < 8){
    //do other stuff
    return;
}

To do what you want with it just:

if($.browser.msie && parseFloat($.browser.version) < 8){
    $('#system').addClass('ie7');
}

edited Jul 27, 2012 at 9:13

Boro

7,9534 gold badges47 silver badges88 bronze badges

answered Sep 8, 2010 at 17:11

Todd Moses

11k11 gold badges50 silver badges65 bronze badges

1 Comment

Brad Over a year ago

At this time (2 years later), .browser has been removed from jQuery.

Enlightened · Accepted Answer · 2010-09-08 17:09:08Z

3

Try this:

<!--[if IE 7]>
<script type="text/javascript">
  $('#system').addClass('ie7');
</script>
<![endif]-->

answered Sep 8, 2010 at 17:09

Enlightened

2392 silver badges13 bronze badges

Comments

ryanulit · Accepted Answer · 2010-09-08 17:08:34Z

0

Here's a few different ways:

answered Sep 8, 2010 at 17:08

ryanulit

5,0116 gold badges46 silver badges66 bronze badges

Comments

Vignesh Subramanian · Accepted Answer · 2015-05-27 05:27:16Z

0

Please be informed that IE8 compat view will also have <!--[if IE 7 ]> as true

So you should do a second level test on the document mode, if you dont want the changes to be reflecting in IE8 Compat view.

<!--[if IE 7]>
    <script type="text/javascript"> 
   try
    {
    if(document.documentMode!=8){
     //Your code comes here
    }
    }
    catch(exception){
    }
   </script>
<!--<![endif]-->

answered May 27, 2015 at 5:27

Vignesh Subramanian

7,31915 gold badges98 silver badges161 bronze badges

Collectives™ on Stack Overflow

How to detect IE7 with javascript or jquery and add a class to div

7 Answers 7

1 Comment

Comments

2 Comments

1 Comment

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

1 Comment

Comments

2 Comments

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related