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

apple web app status bar detect portrait or landscape not working

I'm using this condition to detect portrait or landscape of ios devices. But it's not working. What might be the problem? if (navigator.standalone) { var windowHeight = $(window).height(); var windowWidth = $(window).width(); …
kgam
  • 217
  • 3
  • 4
  • 12
2
votes
0 answers

cache manifest update error over mobile network connection on Iphone standalone web app

I'm creating a web app with asp.net . what I want is this app to be available offline with cache manifest and also to be on full screen(standalone) when is saved to home screen when used on smartphones. I use the code below to update the cache when…
2
votes
1 answer

Link tag not working with rel="manifest"?

Following is my code in an HTML page: Both manifest.json and ng-grid.min.css are…
jithin
  • 1,412
  • 2
  • 17
  • 27
2
votes
1 answer

Fixed positioned elements disappear on page unload

I have a fixed top navigation bar that stays on top of everything while the contents of the page are being scrolled. I noticed that in Chrome for iOS and Safari standalone mode, the fixed bar disappears on page unload before any of the other…
Mati
  • 1,378
  • 15
  • 20
2
votes
0 answers

On screen rotation iOS webapp changes viewport and crashes

I've created a mobile webbased game and use the "Add to homescreen" feature to allow users to add it as an app to their iOS devices. However, recently it started malfunctioning. It has always worked without problem but started acting up possibly…
s1h4d0w
  • 762
  • 6
  • 27
2
votes
0 answers

iOS web app providing quota error on first AppCache download

I am using HTML5 AppCache functionality in my web app. The total size of the files included in the cache manifest is 74mb. My understanding is that when you use in the of your document…
2
votes
1 answer

ngTouch fast click not working on mobile Safari

I'm creating an iOS web app with AngularJS 1.2.10 and use ngTouch to achieve fast click functionality. However it does not seem to work. There is still a noticable delay when using ng-click. As a test I removed ngTouch and added the fastclick.js…
2
votes
2 answers

Offline webapp of ipad only works after loading once while online

I made an offline webapp. Used application cache and all the resources are added in .appcache file. I have also added meta tag suggested by apple. When I add it to home screen, it is added…
Parth
  • 527
  • 1
  • 8
  • 17
2
votes
1 answer

iPhone Configuration Utility - Add webclip for webapp

I'm using Apple iPhone Configuration Utility to configure in-company mobile phones. I'd like to add to home screen an icon for a in-house web application we have developed. Using the Web Clip section, it's easy to add the webclip to home screen,…
2
votes
1 answer

iOS 7 phone-number link doesn't work when webpage is on the home screen

I have phone number links as +xx-xxx-xxxxxx on my webpage. In iOS 7 it works as long as it is viewed in mobile safari. As soon as I've added the webpage to my homescreen (standalone webapp-mode) the links don't work anymore. Has anyone an idea?
2
votes
1 answer

iPhone 5 iOS Webapp Not Fullscreen (not width=device-width)

I am trying to get my site to run fullscreen on an iPhone 5 in webapp mode. I am aware that having width=device-width in the viewport meta tag may cause this problem, but I have checked countless times, and cannot find it in my code. The of my site…
Harri Bell-Thomas
  • 674
  • 1
  • 7
  • 18
2
votes
0 answers

Why doesn't my iOS standalone web app re-retrieve cached images from the server?

I have created a single page website that is designed to be installed on the iOS home screen and accessed as a standalone web app. It's a single page and a cache.manifest ensures that the related assets are cached offline. After a lot of ups and…
2
votes
1 answer

iOS web app, Fullscreen?

Is there any way to determine whether you're in Safari fullscreen mode when you're using the meta tag apple-mobile-web-app-capable?
2
votes
0 answers

RSS feed issue. How to pass html5 AUDIO tag?

I have a feed created using Drupal views which I am passing to an HTML5 web app using RSS. I have three separate feeds going (for three separate pages in the web app). They all work great except for one, the one that contains the HTML5 audio tag.…
SongBox
  • 691
  • 2
  • 8
  • 16
2
votes
1 answer

Add Webapp to iPhone homescreen like TestFlight

How can I have my webapp be added to the homescreen without having the user press the add to homescreen button. TestFlight does this when you install it to your phone, I would like to create a similar experience.
michaellindahl
  • 2,012
  • 5
  • 36
  • 64