Force browser update if IE8 or older
Asked Answered
O

8

6

I wonder if it's possible to show a warning or open a pop-up, which would say update your IE to latest version or use Firefox / Chrome / Safari instead, when browser is Internet Explorer IE8 or older...

I guess I should use that code below inside the tags...

<!--[if lt IE 9]>
...i should use code here...
<![endif]-->

Is it smart to deceted browser with jQuery and loading jQuery lib? Or is it better to just use regular javascript in order to avoid additional issues with very old browsers?

Oona answered 6/4, 2012 at 14:25 Comment(13)
This tool is just right for the job; use it.Misogyny
that's too strict, you're ignoring just about 40% of the visitors of the world that waySkinner
@Skinner If he blocks access to them, then yes he is. But if he just displays a banner message or modal which says 'your browser is out of date, please upgrade' then it will only help. I doubt most IE users fully understand what a browser is anyway.Thirtyeight
@RoryMcCrossan ah yes, if it's only a warning it's ok, as long as the site fully works on at least IE8 (and even better if IE7 too, still like 10% use IE7)Skinner
@Skinner That stat makes me a sad panda.Thirtyeight
You could also prompt for Chrome Frame : chromium.org/developers/how-tos/…Crammer
@Skinner It's circumstantial. If compatibility can be done then it should be done. If he's developing an application which encompasses, for instance, an extensive amount of html5 canvas work then it's probably best that he encourage users to upgrade beyond IE8. As good as people have tried to make canvas preform on IE8 sometimes supporting it just isn't a viable option.Amorette
@user309641 yes, you can take that approach, but then your competitor who doesn't will receive the 40% of the potential customers you're kicking out. Depends on the target audience of courseSkinner
I wonder why Microsoft hates web developers that much. That it made a browser named as IE aka hell to web developersLeopoldoleor
@Leopoldoleor A large part of the problem is the update scheme Internet Explorer abides by. Chrome and Firefox consistently push for the user to update, wherein Internet Explorer wasn't even automatically included in Windows Update until just recently, and even then many people don't bother updating Windows.Amorette
OK, so to smartphone users: Here's a scenario you are probably familiar with... We've all been there where an app says "you must update!", then you click "not now" and the app closes. I would love to see the day where browsers do this as the internet will never stop moving forward.Oby
Check this: nmsdvid.com/iealert - It provides a nicely designed and clear alert with a lot of customized options.Bedridden
Often I wished that all users use only one browser, and if not, that all browsers update automatically without any user interaction... of course only for non-pro users :)Decrement
R
6

You have two options:

  1. Parse the the User-Agent String

    // Returns the version of Internet Explorer or a -1
    // (indicating the use of another browser).
    function getInternetExplorerVersion() {
        var rv = -1; // Return value assumes failure.
    
        if (navigator.appName == 'Microsoft Internet Explorer') {
            var ua = navigator.userAgent;
            var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
    
            if (re.exec(ua) != null) {
                rv = parseFloat( RegExp.$1 );
            }
        }
    
        return rv;
    }
    
    function checkVersion() {
        var msg = "You're not using Internet Explorer.";
        var ver = getInternetExplorerVersion();
    
        if ( ver > -1 ) {
            if ( ver >= 9.0 ) {
                msg = "You're using a recent copy of Internet Explorer."
            }
            else {
                msg = "You should upgrade your copy of Internet Explorer.";
            }
        }
        alert(msg);
    }
    
  2. Using Conditional Comments:

    <!--[if gte IE 9]>
    <p>You're using a recent version of Internet Explorer.</p>
    <![endif]-->
    
    <!--[if lt IE 8]>
    <p>Hm. You should upgrade your copy of Internet Explorer.</p>
    <![endif]-->
    
    <![if !IE]>
    <p>You're not using Internet Explorer.</p>
    <![endif]>
    

Reference: Detecting Windows Internet Explorer More Effectively

Roustabout answered 6/4, 2012 at 18:7 Comment(0)
H
6

You could use something like this

The ie6-upgrade-warning is a little script (7.9kb) that displays a warning message politely informing the user to upgrade the browser to a newer version (links to newest IE, Firefox, Opera, Safari, Chrome are provided).

The webpage is still visible behind a transparent background, but access to it is prevented. The idea is to force users to upgrade from IE6 and avoid the website from a bad reputation that website is not rendering correctly in IE6.

The script is completely translatable in any language, very easy to set-up (one line of code in webpage and one parametter configuration).

Although was created to be used with IE6 users, using the correct parameters you can use it for your scenario.

Hyacinthia answered 6/4, 2012 at 14:32 Comment(1)
<!--[if lte IE 6]><script src="js/ie6/warning.js"></script><script>window.onload=function(){e("js/ie6/")}</script><![endif]-->Jareb
R
6

You have two options:

  1. Parse the the User-Agent String

    // Returns the version of Internet Explorer or a -1
    // (indicating the use of another browser).
    function getInternetExplorerVersion() {
        var rv = -1; // Return value assumes failure.
    
        if (navigator.appName == 'Microsoft Internet Explorer') {
            var ua = navigator.userAgent;
            var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
    
            if (re.exec(ua) != null) {
                rv = parseFloat( RegExp.$1 );
            }
        }
    
        return rv;
    }
    
    function checkVersion() {
        var msg = "You're not using Internet Explorer.";
        var ver = getInternetExplorerVersion();
    
        if ( ver > -1 ) {
            if ( ver >= 9.0 ) {
                msg = "You're using a recent copy of Internet Explorer."
            }
            else {
                msg = "You should upgrade your copy of Internet Explorer.";
            }
        }
        alert(msg);
    }
    
  2. Using Conditional Comments:

    <!--[if gte IE 9]>
    <p>You're using a recent version of Internet Explorer.</p>
    <![endif]-->
    
    <!--[if lt IE 8]>
    <p>Hm. You should upgrade your copy of Internet Explorer.</p>
    <![endif]-->
    
    <![if !IE]>
    <p>You're not using Internet Explorer.</p>
    <![endif]>
    

Reference: Detecting Windows Internet Explorer More Effectively

Roustabout answered 6/4, 2012 at 18:7 Comment(0)
A
5
<script> var ISOLDIE = false; </script>
<!--[if lt IE 9]>
     <script> var ISOLDIE = true; </script>
<![endif]-->

Then later on, where ever you want to draw the line for supporting older versions of IE in your code:

<script>

     if(ISOLDIE) {
          alert("Your browser currently does not support this feature. Please upgrade.");
          window.location = 'http://google.com/chrome';
     }

</script>

It's typically not a good idea to completely remove IE8 support, which is why I think the above solution is a good compromise, because you can add it to components of your website/web application which simply cannot be made to support IE8, but then you could (possibly) still support IE8 in other areas of your website.

Amorette answered 6/4, 2012 at 14:29 Comment(1)
Good, but chances are that if someone's on an old IE version, they are an enterprise that relies on IE-specific features or a PC novice who doesn't really know what a web browser is and just knows to click "the blue e". In cases like these, it may be better to include links for upgrading IE and other browsers, rather than just one specific competing web browser.Mousetrap
V
2

There is this dutch website forcing IE6 and lower users to upgrade their browser, a little adjustment to the "If IE" code you can block from whatever version you like.

http://wijstoppenook.nl/nl/

Scroll down to step 4 and click download or "voorbeeld" for a demo, the first one is a top banner, the second one completely blocks the page.

The only downside, its all in dutch so you'd have to make up your own message.

Vignette answered 6/4, 2012 at 14:32 Comment(0)
P
1

Conditional comments are no longer supported in IE 10. WTF! Link

Parsnip answered 11/8, 2014 at 10:21 Comment(1)
IE10 and IE11 are dead. Now Edge with Chromium is uptodate :-)Parsnip
Y
0

On your site add your code to index.html or index.php

Its working also joomla and wordpress.

<!--[if IE 5]>
<script language="Javascript">
<!--
alert ("It looks like you aren't using Internet Explorer 7. To see our site correctly, please update.")
//-->
</script>
<![endif]-->
<!--[if IE 5.0]>
!--
alert ("It looks like you aren't using Internet Explorer 7. To see our site correctly, please update.")
//-->
</script>
<![endif]-->
<!--[if IE 5.5]>
!--
alert ("It looks like you aren't using Internet Explorer 7. To see our site correctly, please update.")
//-->
</script>
<![endif]-->
<!--[if IE 6]>
!--
alert ("It looks like you aren't using Internet Explorer 7. To see our site correctly, please update.")
//-->
</script>
<![endif]-->

<!--[if IE 7]>
!--
alert ("It looks like you aren't using Internet Explorer 7. To see our site correctly, please update.")
//-->
</script>
<![endif]-->

<!--[if IE 8]>
!--
alert ("It looks like you aren't using Internet Explorer 8. To see our site correctly, please update.")
//-->
</script>
<![endif]-->
Yes answered 31/10, 2014 at 13:44 Comment(0)
E
0

There are many ways, but this is by far the most elegant: http://outdatedbrowser.com/en/how

Epenthesis answered 29/8, 2017 at 3:30 Comment(0)
I
0

This is what I have, which was in a bootstrap download:

<!--[if lt IE 8]>
  <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->

So basically you can have lt or even lte less than or equal.

Impiety answered 11/10, 2021 at 11:56 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.