Jayesh Patel
Filed under - JavaScript, jQuery, Mobile Application, Web Designer Help
No Comments so far. Add yours now

While I understand and value the concept of feature detection over browser detection, sometimes the need for knowing whether or not we’re dealing with a mobile device arises.  For in-depth device checking, you can rely on a complex library such as The MobileESP Project.  But for simpler applications, the following snippet can be useful.

Selec All Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
ar isMobile = {
    Android: function() {
        return navigator.userAgent.match(/Android/i);
    },
    BlackBerry: function() {
        return navigator.userAgent.match(/BlackBerry/i);
    },
    iOS: function() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i);
    },
    Opera: function() {
        return navigator.userAgent.match(/Opera Mini/i);
    },
    Windows: function() {
        return navigator.userAgent.match(/IEMobile/i);
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
    }
};

While this doesn’t account for all mobile platforms, it will pick up the most popular ones out there.

Examples

To check to see if the user is on any of the supported mobile devices:

Selec All Code:
1
if( isMobile.any() ) alert('Mobile');

To check to see if the user is on a specific mobile device:

Selec All Code:
1
if( isMobile.iOS() ) alert('iOS');

Leave your comment

You must be logged in to post a comment.

Share IT © 2018. All rights reserved.