Questions tagged [iphone-standalone-web-app]

An iOS web app whose content is purely web-browser-based and runs outside of Mobile Safari in a chromeless browser using the meta declaration:

In order to make websites and web apps appear more "app-like" on iOS devices, mobile Webkit supports the apple-mobile-web-app-capable meta tag. When the app is opened in Safari, this tag will have no effect. But when this tag is used, and the application is saved to the home screen as an icon and opened that way, it is said to be running in standalone mode and is referred to as a standalone web app.

Standalone web apps do not have any of the Safari UI visible. For security reasons, because they run in their own process space, they run a different version of Webkit and use a different Javascript engine. Because of these differences, standalone web apps often behave differently than apps running in mobile Safari.

This tag is declared:

<meta name="apple-mobile-web-app-capable" content="yes" />

To install the application to work in standalone mode, open the website in mobile Safari and then:

Tap share, add to homescreen, enter a name, and then add.

This installs an icon on the iOS device's home screen. When opened from this icon, the app will be running in standalone mode.

When running in standalone mode, Webkit also supports the apple-mobile-web-app-status-bar-style meta tag to control the color of the iOS device's status bar.

More information can be found in the Safari Web Content Guide's section, "Configuring Web Applications".

259 questions
2
votes
1 answer

jQuery Mobile and Google maps plugin get directions bounds fine in safari but don't work in standalone version

I'm using jQuery Mobile and the Google maps jQuery plugin to ge a route from A to B this works fine in safari on the iPhone but when I make it a standalone version (ie. add to my homescreen) the map once genreted has the two markers and tyhe route…
Neil
  • 107
  • 1
  • 9
2
votes
1 answer

Wrong webkit-tap-highlight-color behavior when page as web standalone app

I'm trying to remove the highlight on tap of a web page in the iPad with the css -webkit-tap-highlight-color: rgba(0, 0, 0, 0) This works great when using directly the browser in my iPad2. However if I move the page to a web app, with the a nice…
ic3
  • 7,917
  • 14
  • 67
  • 115
2
votes
2 answers

Open external page from iPhone web app using JavaScript?

I've built a mobile website - a web site optimized for handheld units. If you are using an iPhone you launch Safari and go to the site URL to use this web app. It can also be run as an iPhone web app by adding it to your home screen. So it's not a…
tkahn
  • 1,407
  • 2
  • 21
  • 37
2
votes
1 answer

Safari Mobile full screen for multiple pages

I was just reading this question How do they do this - Mobile Site Added to Homescreen Appears as Standalone App I was wondering if there is a way to get it to stay in full screen mode for multiple pages?
Syntax
  • 496
  • 2
  • 7
  • 16
2
votes
2 answers

Save website to homescreen on iphone - force name

When you save a website to your iphone home screen, it pick's the site title as the name to save as, is it possible to force as a specific name regardless of which page they bookmark it on a domain?
calebo
  • 3,312
  • 10
  • 44
  • 66
2
votes
1 answer

Change iPad/iPhone layout if user adds to homepage

In iPhone/iPad you can have the address bar removed by using a meta-tag on your page. However it only works if a user clicks the 'add to home page button'. For more info iPad WebApp Full Screen in Safari I need to find a way to slightly change the…
Philip Kirkbride
  • 21,381
  • 38
  • 125
  • 225
2
votes
0 answers

html5 app freezes in ios13 after navigating to an external url in in-app standalone safari browser and back

Issue My web application built using nuxt and installed as web app on iphone becomes unresponsive after I open or visit an external link from the app. Issue specifically comes iOS 13.4 and above on real devices. Simulators works fine. Devices iPhone…
2
votes
0 answers

Web app no longer opening as standalone (iOS 13)

Until about iOS11, my simple web app was running fine in standalone mode. In iOS13 it has stopped working as a PWA completely and I can't figure out why. When I add it to the home screen and click on its icon, the web page is opened in iOS Safari,…
2
votes
1 answer

Twitter connect from website without popup

I have a problem with a website I'm currently working on. I have added a Tweet box to my page for the user to tweet about the current article. If the user submits from the Tweet box and is not currently logged in or is not connected with my site,…
2
votes
1 answer

iOS11 Safari: Add to Home-screen localstorage lifecycle

I found Home-Screen app localstorage is not deleted by Safari clear cache. It seems to be persistent storage, but I cannot find any documents about this. My Question is Is there any document about this behavior? Home-Screen app localstorage…
2
votes
2 answers

Print from Mobile safari web app

Mobile safari for ios4.2 allow printing via air print. Is it possible to do the same via a web app using javascript i.e window.print(); ? I run my webapp using the follow meta tags.
2
votes
3 answers

Is there any way in CSS or Javascript to tell if a user is viewing an HTML page on their iPad as a web app?

Pretty simple question, I have a webpage that is used exclusively on iPads. I've set it up so that you can save it to the home screen and use it as a web app. What I'm wondering is if there is a way via Javascript or CSS to tell if the page is being…
Daniel Jennings
  • 6,304
  • 3
  • 32
  • 42
2
votes
0 answers

Show "scan credit card" in standalone web app after page navigation

I have a 2 page registration/membership microsite. The second page contains a form for collecting credit card information. When tapping the CC number I want the 'Scan Credit Card' button in the top left to show. Here's the input field:
2
votes
2 answers

How can I persist Session data in a standalone web app after an external launch?

I have an MVC 5 mobile website that I am trying to make a standalone mobile web app running full screen on an iPhone. Everything works well until the app launches an external link that will, for example, launch in Safari. Upon returning to the web…
2
votes
1 answer

iPad WebApp Full Screen not working

My site used to work in full screen when I created a Web App for it, however lately it doesn't show in full screen anymore. Is there something that has changed with the new iOS version or a new Safari version? I still have the meta tag :