SlideShare ist ein Scribd-Unternehmen logo
1 von 2
Android or iPhone or Blackberry – How to detect using JavaScript
Post from my blog: http://jbkflex.wordpress.com/2012/01/18/android-or-iphone-or-blackberry-how-to-
detect-using-javascript/

Sometimes when you are writing a mobile web app it becomes important to detect the device type in which the app
will run in the browser. After finding out the device type you may write specific code for each device. One example
can be handling different screen resolutions for the different device types and then make changes to the UI
accordingly. Here’s a rundown of a small example that will show you how to detect the device type.
Mainly you need to detect the browser’s user agent and this will give you the device type. Following are the browser’s
user agent for different devices:
For Android: Mozilla/5.0 (Linux; U; Android 2.2.1; en-us; Nexus One Build/FRG83) AppleWebKit/533.1 (KHTML, like
Gecko) Version/4.0 Mobile Safari/533.1.
Currently, Android devices provide the following in the User-Agent: “Android”, a version number, a device name, a
specific build, Webkit version info, and “Mobile”. The above user agent string is for Android Froyo on a Nexus .
For iOS device (iPod/iPhone,iPad): Mozilla/5.0 (iPod; U; CPU iPhone OS 4_2_1 like Mac OS X; en-us)
AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8C148 Safari/6533.18.5
This one is for the iPod that I am using. For iPhone and iPads the string format is similar, only it will be mentioned
iPhone or iPad in place of iPod. The numbers may change depending on the format.
For Blackberry: Mozilla/5.0 (BlackBerry; U; BlackBerry AAAA; en-US) AppleWebKit/534.11+ (KHTML, like Gecko)
Version/X.X.X.X Mobile Safari/534.11+
This one is for BlackBerry 6 and 7.
If you notice every user agent data has the device type name mentioned in it. That is what helps us to detect it. Let’s
see how to do it.
Detecting user agent is very easy. Use the userAgent property of javascript’s navigator object. Below is the full java
script code block,

var ua = navigator.userAgent;

var checker = {

iphone: ua.match(/(iPhone|iPod|iPad)/),

blackberry: ua.match(/BlackBerry/),

android: ua.match(/Android/)

};

if (checker.android) {

//code for Android

}
else if (checker.iphone) {

//code for iOS device

}

else if (checker. blackberry) {

//code for BlackBerry

}

else{}

Weitere ähnliche Inhalte

Andere mochten auch

Guião para Pais
Guião para Pais Guião para Pais
Guião para Pais BE-EB2
 
01.16 ninguém é sempre perfeito
01.16   ninguém é sempre perfeito01.16   ninguém é sempre perfeito
01.16 ninguém é sempre perfeitoneolookcitnes
 
ประวัติส่วนตัวพลอย
ประวัติส่วนตัวพลอยประวัติส่วนตัวพลอย
ประวัติส่วนตัวพลอยsivaporn612
 

Andere mochten auch (8)

Projekte
ProjekteProjekte
Projekte
 
Magazine draft 1
Magazine draft 1Magazine draft 1
Magazine draft 1
 
Manager
ManagerManager
Manager
 
Guião para Pais
Guião para Pais Guião para Pais
Guião para Pais
 
01.16 ninguém é sempre perfeito
01.16   ninguém é sempre perfeito01.16   ninguém é sempre perfeito
01.16 ninguém é sempre perfeito
 
ประวัติส่วนตัวพลอย
ประวัติส่วนตัวพลอยประวัติส่วนตัวพลอย
ประวัติส่วนตัวพลอย
 
Nam
NamNam
Nam
 
Resume - 8-11-16
Resume - 8-11-16Resume - 8-11-16
Resume - 8-11-16
 

Mehr von Joseph Khan

BackboneJS Training - Giving Backbone to your applications
BackboneJS Training - Giving Backbone to your applicationsBackboneJS Training - Giving Backbone to your applications
BackboneJS Training - Giving Backbone to your applicationsJoseph Khan
 
Creating dynamic SVG elements in JavaScript
Creating dynamic SVG elements in JavaScriptCreating dynamic SVG elements in JavaScript
Creating dynamic SVG elements in JavaScriptJoseph Khan
 
Replicating the Swipe Gesture iPhone Gallery for mobile web– HTML5 – Part 2
Replicating the Swipe Gesture iPhone Gallery for mobile web– HTML5 – Part 2Replicating the Swipe Gesture iPhone Gallery for mobile web– HTML5 – Part 2
Replicating the Swipe Gesture iPhone Gallery for mobile web– HTML5 – Part 2Joseph Khan
 
Customizing the list control - Sencha Touch mobile web application
Customizing the list control - Sencha Touch mobile web applicationCustomizing the list control - Sencha Touch mobile web application
Customizing the list control - Sencha Touch mobile web applicationJoseph Khan
 
Introduction to Adobe Flex - Zaloni
Introduction to Adobe Flex - ZaloniIntroduction to Adobe Flex - Zaloni
Introduction to Adobe Flex - ZaloniJoseph Khan
 
Building Cool apps with flex
Building Cool apps with flexBuilding Cool apps with flex
Building Cool apps with flexJoseph Khan
 

Mehr von Joseph Khan (6)

BackboneJS Training - Giving Backbone to your applications
BackboneJS Training - Giving Backbone to your applicationsBackboneJS Training - Giving Backbone to your applications
BackboneJS Training - Giving Backbone to your applications
 
Creating dynamic SVG elements in JavaScript
Creating dynamic SVG elements in JavaScriptCreating dynamic SVG elements in JavaScript
Creating dynamic SVG elements in JavaScript
 
Replicating the Swipe Gesture iPhone Gallery for mobile web– HTML5 – Part 2
Replicating the Swipe Gesture iPhone Gallery for mobile web– HTML5 – Part 2Replicating the Swipe Gesture iPhone Gallery for mobile web– HTML5 – Part 2
Replicating the Swipe Gesture iPhone Gallery for mobile web– HTML5 – Part 2
 
Customizing the list control - Sencha Touch mobile web application
Customizing the list control - Sencha Touch mobile web applicationCustomizing the list control - Sencha Touch mobile web application
Customizing the list control - Sencha Touch mobile web application
 
Introduction to Adobe Flex - Zaloni
Introduction to Adobe Flex - ZaloniIntroduction to Adobe Flex - Zaloni
Introduction to Adobe Flex - Zaloni
 
Building Cool apps with flex
Building Cool apps with flexBuilding Cool apps with flex
Building Cool apps with flex
 

Kürzlich hochgeladen

"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii SoldatenkoFwdays
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxNavinnSomaal
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupFlorian Wilhelm
 
Dev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebDev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebUiPathCommunity
 
The Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfThe Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfSeasiaInfotech2
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsSergiu Bodiu
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024Lorenzo Miniero
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machinePadma Pradeep
 
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationBeyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationSafe Software
 
What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024Stephanie Beckett
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr LapshynFwdays
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
Artificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxArtificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxhariprasad279825
 
Story boards and shot lists for my a level piece
Story boards and shot lists for my a level pieceStory boards and shot lists for my a level piece
Story boards and shot lists for my a level piececharlottematthew16
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar
 
Powerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time ClashPowerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time Clashcharlottematthew16
 
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Patryk Bandurski
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 3652toLead Limited
 

Kürzlich hochgeladen (20)

"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptx
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
 
Dev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebDev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio Web
 
The Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdfThe Future of Software Development - Devin AI Innovative Approach.pdf
The Future of Software Development - Devin AI Innovative Approach.pdf
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platforms
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machine
 
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry InnovationBeyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
Beyond Boundaries: Leveraging No-Code Solutions for Industry Innovation
 
What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxE-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
 
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
Artificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxArtificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptx
 
Story boards and shot lists for my a level piece
Story boards and shot lists for my a level pieceStory boards and shot lists for my a level piece
Story boards and shot lists for my a level piece
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding Club
 
Powerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time ClashPowerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time Clash
 
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365
 

Android or iPhone or Blackberry – How to detect using JavaScript

  • 1. Android or iPhone or Blackberry – How to detect using JavaScript Post from my blog: http://jbkflex.wordpress.com/2012/01/18/android-or-iphone-or-blackberry-how-to- detect-using-javascript/ Sometimes when you are writing a mobile web app it becomes important to detect the device type in which the app will run in the browser. After finding out the device type you may write specific code for each device. One example can be handling different screen resolutions for the different device types and then make changes to the UI accordingly. Here’s a rundown of a small example that will show you how to detect the device type. Mainly you need to detect the browser’s user agent and this will give you the device type. Following are the browser’s user agent for different devices: For Android: Mozilla/5.0 (Linux; U; Android 2.2.1; en-us; Nexus One Build/FRG83) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1. Currently, Android devices provide the following in the User-Agent: “Android”, a version number, a device name, a specific build, Webkit version info, and “Mobile”. The above user agent string is for Android Froyo on a Nexus . For iOS device (iPod/iPhone,iPad): Mozilla/5.0 (iPod; U; CPU iPhone OS 4_2_1 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8C148 Safari/6533.18.5 This one is for the iPod that I am using. For iPhone and iPads the string format is similar, only it will be mentioned iPhone or iPad in place of iPod. The numbers may change depending on the format. For Blackberry: Mozilla/5.0 (BlackBerry; U; BlackBerry AAAA; en-US) AppleWebKit/534.11+ (KHTML, like Gecko) Version/X.X.X.X Mobile Safari/534.11+ This one is for BlackBerry 6 and 7. If you notice every user agent data has the device type name mentioned in it. That is what helps us to detect it. Let’s see how to do it. Detecting user agent is very easy. Use the userAgent property of javascript’s navigator object. Below is the full java script code block, var ua = navigator.userAgent; var checker = { iphone: ua.match(/(iPhone|iPod|iPad)/), blackberry: ua.match(/BlackBerry/), android: ua.match(/Android/) }; if (checker.android) { //code for Android }
  • 2. else if (checker.iphone) { //code for iOS device } else if (checker. blackberry) { //code for BlackBerry } else{}