iPad WebApp Plein écran dans Safari
Apple indique dans le référence HTML de Safari que le code ci-dessous est censé rendre l’application Web en plein écran sur iPhone OS 2.1 et versions ultérieures.
<meta name="Apple-mobile-web-app-capable" content="yes">
Mais cela ne semble pas fonctionner. Existe-t-il un moyen de masquer le titre/la barre d’emplacement de Safari dans une application Web iPad?
Cela ne fonctionne que lorsque vous avez enregistré un favori dans l'application sur l'écran d'accueil. Pas si vous naviguez sur le site normalement.
Si vous souhaitez rester dans un navigateur sans lancer de nouvelle fenêtre, utilisez ce code HTML:
<a href="javascript:this.location = 'index.php?page=1'">
Tout d’abord, lancez votre navigateur Safari à partir de l’écran d’accueil et accédez à la page Web à afficher en plein écran.
Après avoir localisé la page Web, appuyez sur l’icône de flèche en haut de votre écran.
Dans le menu déroulant, appuyez sur l'option Ajouter à l'écran d'accueil.
La fenêtre Ajouter à l'accueil devrait être affichée. Vous pouvez personnaliser la description qui apparaîtra en tant que titre sur l'écran d'accueil de votre iPad. Lorsque vous avez terminé, appuyez sur le bouton Ajouter.
Une nouvelle icône devrait maintenant apparaître sur votre écran d'accueil. Appuyez sur l'icône pour ouvrir la page Web en mode plein écran.
Remarque: l’icône de l’écran d’accueil de votre iPad n’ouvre que la page marquée en mode plein écran. La page suivante que vous visiterez contiendra l’adresse Safari et les barres de titre. Cette façon de lire votre page Web ou votre présentation HTML5 en mode plein écran fonctionne si le code source de la page Web contient la balise suivante:
<meta name="Apple-mobile-web-app-capable" content="yes">
Vous pouvez ajouter cette balise à votre page Web à l'aide d'un outil tiers, par exemple, l'outil de référencement iWeb ou tout autre outil de votre choix. Veuillez noter que vous devez d'abord ajouter le tag, actualiser la page puis ajouter un signet à votre écran d'accueil.
Il ouvre uniquement la première page (mise en signet) en plein écran. Toute page suivante sera ouverte AVEC la barre d'adresse visible à nouveau. Quelle que soit la balise meta que vous avez insérée dans l'en-tête de votre page ...
Ce site a une solution de contournement, même effet, utilise du javascript pour définir la première div enfant sur la hauteur totale de la fenêtre. http://webapp-net.com/Demo/Index.html
On dirait que la plupart des réponses sur ce fil n'ont pas suivi. iOS Safari sur iPad a support plein écran maintenant et il est très facile à implémenter en utilisant javascript.
Voici mon article complet sur la mise en œuvre de la fonctionnalité plein écran sur votre application Web.