Detect an app on home screen of iphone

iphone iphone-web-app homescreen iphone-standalone-web-app
smoizs picture smoizs · Aug 10, 2011 · Viewed 7.1k times · Source

You know how its possible to add a web app to the home screen of an iPhone... well now how do i detect if my app has been added to the home screen of a user's iPhone.

And if it has been added, how do i launch the app stored on the user's home screen rather than in Safari.

NOTE : its a web app simply bookmarked on the home screen of an iPhone - it is NOT a native app.

Any Ideas ?

Answer

tilo picture tilo · Aug 10, 2011

According to Safari Web Content Guide, you have to set <meta name="apple-mobile-web-app-capable" content="yes" /> in your webpage to present your content in full-screen mode.

You can also set a startup image to make it look like a native app by setting <link rel="apple-touch-startup-image" href="/startup.png">

Edit (Detect if run in full-screen mode)

You can add some JS-Code to your webpage to detect if it is run in full-screen mode:

<script type="text/javascript">
if ('standalone' in navigator && !navigator.standalone && (/iphone|ipod|ipad/gi).test(navigator.platform) && (/Safari/i).test(navigator.appVersion)) {
    __do something here__
}

For more information on this, this project could be of interest.

Related questions

Hiding Safari User Interface Components on iPhone

In an attempt to hide the Safari UI components for an web-app bookmarked as a Homescreen Icon. I am using this meta tag <meta name="apple-mobile-web-app-capable" content="yes" /> as specified on iPhone Dev Center but the address bar …

Read More
iPhone and HTML5 Cache Manifest

I am trying to build an iPhone web application using ASP.NET. The page is dynamically rendered once for each visitor. At this point the page can be bookmarked and it will never change again for that visitor. For this …

Read More
watchPosition() vs getCurrentPosition() with setTimeout

I need to determine a person's location within 50m. I'm wondering if I should use navigator.location.watchPostion() or call getCurrentPostion() over and over again. watchPostion() is the proper W3C API for doing what I want, but practically, it …

Read More