È possibile nascondere la barra degli indirizzi e la barra di stato in iOS 7 Safari?


12

È possibile nascondere la barra degli indirizzi e la barra di stato in iOS 7?

In un'app orizzontale sto attualmente usando il codice qui sotto per farlo per le versioni precedenti di iOS e funziona bene anche su IOS 7: quando si apre la pagina si passa a schermo intero e rimani così.

JS:

window.addEventListener("load",function() {
    // Set a timeout...
    setTimeout(function(){
        // Hide the address bar!
        window.scrollTo(0, 1);
    }, 0);
});

HTML:

<!-- For iOS web apps -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="AMC Walking Dead Story Sync">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">

Il fatto è che su iOS 7 iPhone e iPad quando si tocca la parte inferiore dello schermo vengono visualizzati la barra degli indirizzi e la barra di stato e l'unico modo per sbarazzarsi di esso è cambiare l'orientamento del telefono e quindi riportarlo all'orientamento precedente. Esiste un modo per evitare quella manipolazione?



Non vedo una risposta su SO che funziona più del codice di esempio qui. Hmm ...
— bmike

Risposte:


15

Esiste un metodo:<meta name="viewport" content="minimal-ui”>
( ma funziona solo su iOS 7.1 - non su 7.0 né 8.0 )

fonte: StackOverflow


Maggiori dettagli, dal registro delle modifiche di iOS 7.1 beta 2 e note sulla versione :

Safari Note

È stata aggiunta una proprietà, minimal-ui, per il tasto meta tag viewport che consente di ridurre a icona le barre superiore e inferiore dell'iPhone durante il caricamento della pagina. Mentre sei su una pagina usando minimal-ui, toccando la barra superiore si riportano le barre. Toccando di nuovo il contenuto, vengono nuovamente eliminati.

Ad esempio, utilizzare <meta name=”viewport” content=”width=1024, minimal-ui”>.


aggiornamento: ho confermato che questo metodo funziona su iOS 7.1 (versione finale ufficiale). Puoi confermare tu stesso con la mia app Web , che utilizza la soluzione di meta tag descritta sopra.

inserisci qui la descrizione dell'immagine


Aspetterò la versione finale per provare, quindi accetterò la tua risposta. Molte grazie.
— svassr,

Hmmmm. Sto usando 7.1.1 e la tua app web collegata sopra NON nasconde la barra degli indirizzi ecc. Quando viene caricata. L'hanno rotto in 7.1.1?
— Brian B,

7
Questo è stato rimosso in iOS8.
— Charlie Schliesser,

1
Controllare questo post su applicazione iOS 8: stackoverflow.com/questions/24889100/...
— svassr

1

Ho visto questo consigliato <meta name="apple-mobile-web-app-capable" content="yes"> Esegue il sito in modalità autonoma, che nasconde l'interfaccia utente. Non sono chiaro su come questo si confronti con la soluzione minimal-ui sopra. Ho l'impressione che questa soluzione funzioni anche per le versioni iOS precedenti alla 7.1.


5
Questa soluzione funziona solo per la pagina Web aggiunta come app alla schermata principale.
— svassr
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.