[ACCEPTED]-Display a Message When a Browser is Unsupported-cross-browser

The best way to target IE is through the 3 use of conditional comments. You can then 2 add some specific HTML that will only display 1 in Internet Explorer.

<!--[if IE 6]>
<h1>Please upgrade your browser!</h1>
<![endif]-->

More on the subject:

http://www.quirksmode.org/css/condcom.html

Ok, I'll make this easy. No popups! A statistical 12 disaster. Here is a nice little that sits 11 on top of the . I only really worry about 10 IE 6 or earlier since its the biggest culprit 9 when it comes to messign up my designs. Below 8 is a conditional statement (the best way 7 to go in my opinion).

Stick this in the head (put in whatever content you wish):

<!--[if lte IE 6]>
<div id="warning">
<h4 class="red">Your Browser Is Not Supported!</h4><br />
<p>Please upgrade to <a href='http://getfirefox.com'>FireFox</a>, <a href='http://www.opera.com/download/'>Opera</a>, <a href='http://www.apple.com/safari/'>Safari</a> or <a href='http://www.microsoft.com/windows/downloads/ie/getitnow.mspx'>Internet Explorer 7 or 8</a>. Thank You!&nbsp;&nbsp;&nbsp;<a href="#" onClick="document.getElementById('warning').style.display = 'none';"><b>Close Window</b></a></p>
</div>
<![endif]-->

Stick this in your external styling sheet. I would not use inline styling.

#warning        {position:relative; top:0px; width:100%; height:40px; background-color:#fff; margin-top:0px; padding:4px; border-bottom:solid 4px #000066}

Style it however you 6 want - go nuts! You can get very specific 5 with javascript to detect any browser, so 4 if ya know how, it can add greater specificity.

This 3 will be a pretty little box that sits on 2 top of your content and lets your users 1 see that their browser sucks.

If you want to determine if it's anything 12 other than support browsers, you might want 11 to use jQuery's browser detection, something 10 like:

<script type="text/javascript">
// check if browser is IE6 (when IE) or not FF6 (when FF)
if (($.browser.msie && $.browser.version.substr(0,1) == '6')
    || ($.browser.mozilla && $.browser.version.substr(0,1) != '3')) {
        $('#browserWarning').show();
}
</script>

Update: As different said, a much better option is 9 to use the IE if statements, such as:

<style type="text/css">
/* this would probably be in a CSS file */
#browserWarning { display:none; }
</style>
<!--[if IE 6]>
<style type="text/css">
#browserWarning { display:; }
</style>
<![endif]-->

This 8 option is much better because it doesn't 7 require the browser version to "perfect". This 6 won't work though, if you want to detect 5 other browsers as they don't support the 4 if statements. Then you may want to use 3 jQuery to detect the browser, although I 2 would recommend trying to avoid it as much 1 as much as possible.

Conditional comments provide a way of only displaying content 1 for specific versions of Internet Explorer.

<!--[if IE 6]>
Special instructions for IE 6 here
<![endif]-->

There is a project called Push Up the Web which advises 17 all users to upgrade to newer versions of 16 their browsers. It is unobtrusive and easy 15 to add.

As some have suggested, the best 14 thing to do is use conditional comments 13 to target Internet Explorer effectively.

To 12 the other commenters, with the release of 11 Internet Explorer 8 (which 10 effectively added two additional browsers 9 to test: standards + compatibility mode), Internet Explorer 6 8 has run its course. It is time for those 7 people to upgrade browsers and in some cases 6 OSes/computers. Internet Explorer 6 5 is holding back the progression of the web. It's a drain 4 in resources to support. It has reached 3 Netscape 4 status. Major sites and companies 2 are joining the battle as well.

• Gmail asks Internet Explorer 6 users to upgrade for improved performance
• 37signals dropped support for Internet Explorer 6
• Apple's MobileMe doesn't support Internet Explorer 6
• Norway dropped support
• Facebook chat doesn't support Internet Explorer 6
• Microsoft will stop supporting Internet Explorer 6 in June 2010

And more 1 reading:

• http://www.bringdownie6.com/bring-down-ie-6.html
• http://ripie6.com/
• http://ie6.forteller.net/

https://browser-update.org

An initiative by web designers to inform 1 users about browser-updates

My advice is not to use a popup window or 7 a message box. They are very annoying and 6 make for a bad user experience. Better 5 insert some <div> with the notice and make it 4 stand out from the rest of the page. Don't 3 overdo it, just assign it some colours that 2 makes sure it is not overlooked (and please: Don't 1 use <blink> ;-)

Although telling users to update their browsers 14 and them actually doing it would be great 13 it really isn't going to happen. If the 12 user hasn't upgraded their browser by now 11 there is normally a reason for it, lack 10 of computer knowledge or no control over 9 the computer itself. For example employees 8 browsing your site on work machines.

I really 7 think you should reconsider fixing the issues 6 that your users will have or consider progressive 5 enhancements. The idea is that the basic 4 functionality of your website works in every 3 browser, then any extra functionality is 2 developed so that it is only visible / useable 1 on browsers that can support it.