Stackoverflow - iOS Web App: Showing content only if the application is standalone
http://stackoverflow.com/a/11109628/918414
by mrjordy
HTML
<div id="iosPWA"></div>
<script>
/* by: thinkingstiff.com
license: http://creativecommons.org/licenses/by-nc-sa/3.0/us/ */
var headerUri = 'http://stackoverflow.com/a/11109628/918414',
headerCaption = 'iOS Web App: Showing content only if the application is standalone';
document.body.insertAdjacentHTML(
'afterBegin',
'<a href="' + headerUri + '" '
+ 'target="_top" '
+ 'onmouseover="this.style.opacity=\'.95\'" '
+ 'onmouseout="this.style.opacity=\'1\'" '
+ 'style="'
+ 'background-color: black;'
+ 'background-image: linear-gradient( top, rgba( 255, 255, 255, .3),...
JavaScript
function isIOS() {
var userAgent = window.navigator.userAgent.toLowerCase();
return /iphone|ipad|ipod/.test( userAgent );
};
function isStandalone() {
return ( isIOS() && window.navigator.standalone );
};
window.onload = function () {
if( isStandalone() || !isIOS() ) {
//start app
document.getElementById( 'iosPWA' ).textContent = 'start app';
} else {
//display add to homescreen page
document.getElementById( 'iosPWA' ).textContent = 'add to homescreen';
};
};