detect IE6

**dimis283** · Mar 28, 2011 03:13

How can I detect that user use IE7 or IE6.
I made a google search but I was confused.
For example does this link works ok for IE7 or IE6?
Meaning that navigator.appName returns "Microsoft Internet Explorer"

**paul_wilkins** · Mar 28, 2011 05:27

Originally Posted by dimis283

How can I detect that user use IE7 or IE6.

Typically by using object detection that relates to the problem you're trying to solve.

What's the problem?

**dimis283** · Mar 28, 2011 07:32

I want to use javascript to set some css if browser is IE6 and 7.
Till now I set it if browser is IE.
Also this site use moo tools so it has built in functions detecting the browsers (I did not use mootools )

**paul_wilkins** · Mar 28, 2011 07:36

Originally Posted by dimis283

I want to use javascript to set some css if browser is IE6 and 7.

The best way to do that is without JavaScript.

Using HTML conditional comments you can guarantee that it will work even if javascript is disabled.

Code:

<!--[if (gte IE 6)&(lte IE 7)]>
<link type="text/css" rel="stylesheet" href="ie6-7.css">
<![endif]-->

**dimis283** · Mar 28, 2011 07:53

The first problem is that I want the text of my "text div" to be in the middle of this div if it is "little" for example below 300 characters,so I want some css for IE6,7.
Look this.

**paul_wilkins** · Mar 28, 2011 08:02

Why do IE6 and IE7 exclusively require the additional CSS codes? Because they need fixing in some way that IE8 or IE9 don't require?

If that's the case, there are CSS specific techniques that easily achieve that without the complexities of scripting.

**dimis283** · Mar 28, 2011 08:14

For sure.
But I need to know if text has bellow 300 (for example) characters ans so to give the new css.
Can I do it with out javascript?
How can I use plain css to find the characters or to give instructions like

Code:

if (mydiv.chars<300) {css code}

Notice that there is already a css file.

**paul_wilkins** · Mar 28, 2011 08:15

Originally Posted by dimis283

For sure.
But I need to know if text has bellow 300 (for example) characters ans so to give the new css.
Can I do it with out javascript?
How can I use plain css to find the characters or to give instructions like

Code:

if (mydiv.chars<300) {css code}

Notice that there is already a css file.

Why is IE6 and IE7 receiving the special treatment, while IE8 and IE9 are not?

**dimis283** · Mar 28, 2011 08:20

I am a newbie at css.
This was the suggestion at css forum.
Maybe IE6 is too old for some css...as I notice for an error that gave me with that code...
(My IE6 give an error for display:table-cell at javascript code)

**paul_wilkins** · Mar 28, 2011 08:35

Let me ask this another way.

Please show us HTML/CSS code that have which works fine in IE8/IE9, but doesn't work as expected in IE6/IE7

**dimis283** · Mar 28, 2011 09:04

I change the css I had but

Code:

$('content_text').setStyle("vertical-align","middle");

worked at my firefox but not at my IE6 (I havent newest IE

)
This worked at IE6 (maybe I do some error...)

Code:

$('content_text').setStyle("position","relative");
$('content_text').setStyle("top","35%");

**paul_wilkins** · Mar 28, 2011 14:43

Originally Posted by dimis283

I change the css I had but

Code:

$('content_text').setStyle("vertical-align","middle");

worked at my firefox but not at my IE6 (I havent newest IE

)
This worked at IE6 (maybe I do some error...)

Code:

$('content_text').setStyle("position","relative");
$('content_text').setStyle("top","35%");

What is the HTML we would need to use with that experience the problem?

We cannot develop a working solution if we cannot experience the problem.

**Michael Morris** · Mar 28, 2011 14:52

Originally Posted by dimis283

How can I detect that user use IE7 or IE6.
I made a google search but I was confused.
For example does this link works ok for IE7 or IE6?
Meaning that navigator.appName returns "Microsoft Internet Explorer"

Test for functionality, not for browser version. The IE family has the If IE tags for use with HTML and CSS, but in javascript it is best to check to see if an object exists before attempting to use it.

By testing for functionality you get a bit of future proofing, but also you don't need to worry as much about things breaking in other browsers.

**dimis283** · Mar 29, 2011 01:54

Originally Posted by Michael Morris

Test for functionality, not for browser version. The IE family has the If IE tags for use with HTML and CSS, but in javascript it is best to check to see if an object exists before attempting to use it.

By testing for functionality you get a bit of future proofing, but also you don't need to worry as much about things breaking in other browsers.

You are right but also at my situation for example the code

Code:

$('content_text').setStyle("display","table-cell");

give an error at my IE7,IE6.

**paul_wilkins** · Mar 29, 2011 02:02

Originally Posted by dimis283

You are right but also at my situation for example the code

Code:

$('content_text').setStyle("display","table-cell");

give an error at my IE7,IE6.

Then use object detection as we have all been saying, to determine whether the web browser is capable of supporting such techniques.

jQuery makes this easy. It provides useful support for object detection. Checking for box model support would be appropriate here.

Code javascript:

if ($.support.boxModel) {
    $('content_text').setStyle("display","table-cell");
} else {
    // IE6 and IE7 will run the code in this "else" section
    // ...
}

What would you have the IE6/IE7 browsers do instead?

**dimis283** · Mar 29, 2011 02:47

I understand but also this site use mootools (We make a few changes).
Is there a way to do this with mootools (or a more generall way)?

**paul_wilkins** · Mar 29, 2011 03:09

Originally Posted by dimis283

I understand but also this site use mootools (We make a few changes).
Is there a way to do this with mootools (or a more generall way)?

Sure thing. You can a 1 pixel div with 1 pixel of left padding, and check if its offsetWidth is equal to 2. If it is, then you know the browser has proper box model support.

That's the precise technique used by jQuery to check for box model support.

Code javascript:

// Figure out if the W3C box model works as expected
// document.body must exist before we can do this
jQuery(function() {
	var div = document.createElement("div");
	div.style.width = div.style.paddingLeft = "1px";
	document.body.appendChild( div );
	jQuery.boxModel = jQuery.support.boxModel = div.offsetWidth === 2;
	document.body.removeChild( div ).style.display = 'none';
 
	div = null;
});

Wrapping that in the MooTools wrapper without the jQuery stuff, and adding a few explanitory comments, we get this MooTools type of code:

Code javascript:

window.addEvent('domready', function() {
    function hasBoxModelSupport() {
        // Figure out if the W3C box model works as expected
        // document.body must exist before we can do this
 
        // Setup
        var isSupported = false;
        var div = document.createElement("div");
 
        // Test
        div.style.width = '1px';
        div.style.paddingLeft = '1px';
        document.body.appendChild(div);
        isSupported = (div.offsetWidth === 2);
 
        // Cleanup
        document.body.removeChild(div).style.display = 'none';
        div = null;
 
        return isSupported;
    });
 
    if (hasBoxModelSupport()) {
        // yay, box model support
    } else {
        // boo, IE6 or IE7
    }
});

**PaulPov** · Dec 6, 2011 17:15

I truly believe we all should stop supporting IE6.
It was made 10 years ago and the web has gone far.
In my company - <snip/> I insist we don't provide IE6-optimized sites anymore.
It's just not efficient from the business point of view to spend time optimizing a contemporary site for IE6.
I prefer coming to the client's office and making them install a modern browser )

User Tag List

Thread: detect IE6

Thread Tools

Display

Hybrid View

detect IE6

Bookmarks

Bookmarks

Posting Permissions