Browser Detection

Have an Idea?

If you have a good idea and want it to be implemented by DevSlide Labs, get in touch with us!

Suggest an Idea!

Have a Question? Contact Us

Chat with an online representative

Direct:
614-827-0499

Old Browsers Detection

Browser Detection

Version: 1.1

What It’s For

This Browser Detection script is a tiny JS script written in core JavaScript and is compatible with any JS frameworks such as jQuery and MooTools. The script detects which browser the user is using and displays a friendly (and nice looking) suggestion to anyone running an old browser.

You may download the script for use on your server or you can just load the script from our servers. We created a generator form which will help you quickly configure the script and modify the message to better match your user base.

Key Features

  • Easy to install, clean, light script
  • Written in core JS and compatible with any JavaScript framework (i.e. jQuery, MooTools, ExtJS, and others)
  • Ability to detect browser and operating system
  • Fully customizable, or choose from variety of messages
  • Nicely styled light box message

A Little History

If you ask anyone who works with XHTML/CSS what they hate most, the answer is always: “I hate IE 6 and Starbuck’s coffee”. Well, we can’t help you with coffee, but we can with the IE6 problem.

We made a tiny (but effective) JS script which detects if an old browser is being used and shows a nice looking, friendly message to the user asking them to upgrade their browser to a more modern browser. It provides the user with links to the official download sites for the most recent versions of several popular browsers. The links open in another window and there is also an option for the user to skip the message and elect to be reminded later or never show the message again.

As for the coffee problem, here is a $13k solution (not a promotion, just a solid solution to crappy coffee) :)

Shot-Down Names ~Sorta’ — (suggest a better name)

  • I hate IE6
  • Browser Detective
  • JavaScript Browser Detection Script
  • No old browsers allowed
  • Browser Upgrade Notification
  • Browser Detection (current choice)
  • Browser Breakthrough
  • Browservention
  • Smart Browser Detection (or Detector)
  • Smart Browser Notice (or Notifier)
  • Friendly Browser Detection (or Detector)
  • Friendly Browser Notice (or Notifier)
  • Smart Browser Informer
  • Friendly Browser Informer

Technologies Used

  • JavaScript
  • Ugg… old browsers

Screenshots

System Requirements

  • An old crappy browser with ability to display HTML, run JavaScript and store cookies (cookies used to remember the user’s preference if they skip the browser upgrade — to not annoy them too much)
  • A solid hatred of hand coding markup for IE6 compatibility

21 Comments

  1. Thank you for sharing this script! I added it to my site (and this might be a silly question), but how on earth do I test it? I am using new browsers, of course. Thanks again!

    Comment by Maggy

  2. can this be tricked to read if user has a mobile browser???

    Comment by christopher

  3. Hi. It’s me again with another name suggestion for Browser Detection. I think a great name would be:

    Browservention

    It’s a cross between Browser and Intervention because I believe anyone not using the latest and greatest browsers needs an intervention.

    Mike

    Comment by Mike

  4. This works fantastically well. Thanks for sharing!

    The only thing that caused an issue for me was a missing ” after calling the JS (using the browser detection configuration).

    Cheers

    Daithí

    Comment by Daithí

  5. The IE link is not working. when i tried clicking on IE its redirected me to http://windows.microsoft.com/en-us/internet-explorer/products/ie/home where it says The page you requested cannot be found. Please Fix it

    Comment by anish@pcpedia

  6. Why not shuffle the list?

    Array.prototype.shuffle = function () {
    var j, tmp, i = this.length;
    if (i == 0) return false;
    while (–i) {
    j = Math.floor(Math.random() * (i + 1));
    tmp = this[i];
    this[i] = this[j];
    this[j] = tmp;
    }

    browsersList.shuffle();

    Comment by Kenny

  7. Hi…how to make its pop once? because when user click remind me later, it will pop up again when user visit the website after that.

    Thanks

    Comment by Arm

  8. This browser detection script is great! I have noticed a minor bug during custom configuration, however:

    Line 145 of browser-detection.js:

    noticeLangCustom.neverRemindMeAgain

    should be

    noticeLangCustom.neverRemindAgain

    Keep up the great work!

    Comment by Taylor

  9. Hi Taylor,

    Thank you for pointing this out to us. We were able to recreate the issue and apply a patch. It is now available in the download above.

    Comment by Casey - DevSlide Support

  10. Great Script i added this on my site, and i am being reminded that i have to upgrade my browser..cool..

    Comment by Surya Kiran

  11. Hi, this script is very useful. Thank you.
    I have a problem; It doesn’t detect IE 9 Compatibility Mode. But Trident token indicates browser is IE 9. (Trident/5.0) If the users view in compatible mode, I don’t want to show browser upgrade message. I am going to try fix. Thanks.

    Comment by karayakar

  12. Hi, finally I fixed the script, now it is detect to IE 9 Compatibility mode and gives alert to user. here is the changes.
    add Trident ;
    this.browser = ”;
    this.browserVersion = 0;
    this.Trident = -1;
    ……

    if (this.browser == ”) {
    this.browser = ‘Unknown’;
    } else if (this.browserVersion == 0) {
    this.browserVersion = parseFloat(new Number(RegExp.$1));
    this.Trident = navigator.userAgent.indexOf(“Trident”);

    if (this.Trident != -1) {
    alert(‘You are using IE 9 Compability Mode\nPlease Exit from Compability mode for best view.’);
    }
    }

    and add trident control to here;

    if ((notSupportedBrowsers[i].version == “Any” || (this.browserVersion <= parseFloat(notSupportedBrowsers[i].version) && this.Trident == -1))) {
    oldBrowser = true;
    break;
    }

    That's it :)

    Thanks.

    Comment by karayakar

  13. Your code classifies Internet Explorer 10 as an old browser. Will there be an update to fix this? Thanks!

    Comment by Steve Cole

  14. Nice Browser Detection script !

    In your Browser Detection Configuration page, the configuration script generated for custom message is not working. the var noticeLang must be set as \’custom\’ to correct the bug !

    Have a nice day !

    Vincent.

    Comment by Vincent

  15. Is this detection script still actively maintained? We’re looking at adding something like this to some of our platforms, but it looks like this one has been forgotten. We couldn’t even get the download link to work (it produced a ZIP file that Windows said was corrupted).

    Comment by Miles Rausch

  16. Miles,

    It is maintained (May 2013) and an updated version is in progress. I have emailed you the zip file. Let me know if there is still an issue. We will check the compression script for the download on the site. Thanks for the heads up!

    Travis

    Comment by Travis - DevSlide Support

  17. Hello!

    I have used the script and it works, but it creates a problem: my custom JavaScript/jQuery is ignored by the browser unless page is manually reloaded.

    Also,

    $(“#browser-detection-close,ul.bd-skip-buttons li button”).on(‘click’, function () {
    location.reload();
    });

    does NOT work. What should I do?

    Thank you!

    Comment by Razvan

  18. I tried to download the zip but it never works. Could you e-mail the zip, please?

    Comment by Geoff Oliver

  19. Hi Geoff,

    The file has been emailed. Thanks!

    Travis

    Comment by Travis - DevSlide Support

  20. The Zip file looks to be corrupt. Tried downloading it from a few different browsers and I get the same error message. Can you take a look to see if the Zip file works for you?

    Comment by WebGirl

  21. Hi WebGirl,

    The file has been emailed to you. Note: we plan to release an updated version soon.

    Thank you,

    Travis

    Comment by Travis - DevSlide Support

Leave a comment


Have a good idea?

While we've been making apps, scripts and programs for a long time, our labs area is new. So, help us grow it! - It's easy. If you have an idea, need a tool or whatever, just tell us about it, and it might end up in the labs area. :)

Our labs area is for sharing and developing new ideas, which may or may not end up as products. If you have a proprietary project and are looking for a development team, checkout MW7!

Submit an Idea!