Domanda

Sono molto nuovo per lo sviluppatore web di iPhone. Ho iniziato con la lettura della Guida al contenuto Web di Safari. Poi ho scoperto che possiamo nascondere l'interfaccia utente, ad esempio la barra degli indirizzi di Safari. Pertanto, ho seguito l'istruttore. Il risultato non è quello che mi aspettavo. La barra degli indirizzi è ancora visibile.

Ho inserito questo meta tag nel file html.

e questo è il mio codice


<head>     
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Hello iPhone Web App</title>
    <style type="text/css">
          form{
           width:100%;
         }

         #searchBox{
          font-size:25px;
        width:50%;
         }
         #send{
          font-size:25px;
         }

         #containerTop{
           text-align:center;
           width:100%;
        }

    </style>
</head>
<body>
    <form method="get">
        <div id="containerTop">
            <input type="text" id="searchBox" name="search" autocapitalize="off" size="15" maxlength="128" />
            <input type="submit" id="send" value="ค้นหา" />
        </div>         
    </form>
</body>


Non vedo l'ora di rispondere, grazie

È stato utile?

Soluzione

" mela-mobile-web-app-capable " funziona magicamente solo quando avvii la tua WebApp dopo aver salvato un collegamento alla schermata principale e avvia la tua WebApp dalla nuova icona.

Per le normali pagine Web è necessario scorrere la barra degli indirizzi fuori dalla vista usando:

<script type="text/javascript">
window.addEventListener('load', function(){ setTimeout(function(){ window.scrollTo(0,0); }, 100); }, true);
</script>

La barra di navigazione nella parte inferiore dello schermo è permanente per le normali pagine Web, ma è rimovibile per le WebApp (salvate nella schermata principale) utilizzando la funzione "apple-mobile-web-app-compatibile"; meta tag.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top