Home > iPad, iPhone, JavaScript, jQuery > jQuery: Plugins to detect iPad and iPhone devices

jQuery: Plugins to detect iPad and iPhone devices

November 30th, 2012 Leave a comment Go to comments

jQuery plugin for iPad detection

Below is a simple jQuery plugin to detect whether a page is opened in an iPad:

(function ($) {
    $.isIPad = function () {        
        return (typeof navigator != "undefined" && 
               navigator && navigator.userAgent && 
               navigator.userAgent.match(/iPad/i) != null);
    };
})(jQuery);

...
// using
$(function(){
    if($.isIPad())
        alert('Hello, iPad');
});

jQuery plugin for iPhone detection

The next plugin allows to detect an iPhone:

(function ($) {
    $.isIPhone = function () {
        if(!$.isIPad())
            return (typeof navigator != "undefined" && 
               navigator && navigator.userAgent && 
               (navigator.userAgent.match(/iPhone/i) != null || 
                navigator.userAgent.match(/iPod/i) != null));
        return false;        
    };
})(jQuery);

...
// using
$(function(){
    if($.isIPhone())
        alert('Hello, iPhone');
});

Note, initially I check if the device is an iPad and only then try to identify it as an iPhone. I do so because people reports that some iPad browsers/applications use substring ‘iPhone’ in their userAgents along with the expected ‘iPad’. For example, such behavior was noticed in Facebook UIWebView.

jQuery plugin for Apple mobile device detection

To detect any Apple mobile devices (iPad, iPhone or iPod) you can use the following jQuery plugin:

(function ($) {
    $.isAppleMobile = function () {
        return (typeof navigator != "undefined" && 
               navigator && navigator.userAgent && 
               navigator.userAgent.match(/(iPad|iPhone|iPod)/i) != null);
    };
})(jQuery);

...
// using
$(function(){
    if($.isAppleMobile())
        alert('Hello, Apple device');
});
Related posts:
 
  1. No comments yet.
  1. No trackbacks yet.