Mayank Tripathi
Mayank Tripathi

Reputation: 1342

Detect if the user is navigating through the safari mobile browser on iphone

I am trying to detect if the user is navigating my website from safari browser on the iphone using jquery / javascript.

I am able to detect the IOS Environment using the user agent string

/iphone/i.test(navigator.userAgent.toLowerCase())

But this detects the Apple Webkit Environment i.e. it is same for all the browsers on the device. Can anyone suggest any different approach.

Upvotes: 3

Views: 10453

Answers (3)

Farid Najmee
Farid Najmee

Reputation: 21

var isFirefox = navigator.userAgent.indexOf("FxiOS") != -1;  
var isChrome = navigator.userAgent.indexOf("CriOS") != -1;  
var isEdge = navigator.userAgent.indexOf("EdgiOS") != -1;  
var isOpera = navigator.userAgent.indexOf("OPT") != -1;

if (!isFirefox && !isChrome && !isEdge && !isOpera){  
  console.log("Only display in Safari")  
} else {  
  console.log("Only display in Firefox/Chrome/Edge/Opera")  
}        

Hi, this way worked for me to detect only safari in ios mobile. The value FxiOs, CriOs, etc, I get from the userAgent value.

Upvotes: 0

Pankaj
Pankaj

Reputation: 524

Since the other answer doesn't include detection of an iPhone, including that part.

var isIphone = /(iPhone)/i.test(navigator.userAgent);
var isSafari = !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/);

if(isIphone && isSafari){
    //do something
}

If you want to detect a particular iOS version and above, say iOS 7.0 and above then you can use the below code. It detects iOS version 7-19(for upcoming versions).

var isIphone= /(iPhone)*(OS ([7-9]|1[0-9])_)/i.test(navigator.userAgent);  

Upvotes: 2

urbz
urbz

Reputation: 2667

UPDATED:


Try this, for detecting Safari browser in an iPhone:

var isSafari = !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/);

It identifies Safari 3.0+ and distinguishes it from Chrome.

JsFiddle

Upvotes: 7

Related Questions