jQuery: Plugins to detect iPad and iPhone devices
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');
});