safari La barra dei menu IOS è in conflitto con i pulsanti del 10% inferiore dello schermo

10

Sto costruendo un portale web che deve essere funzionale e carino su più piattaforme. Una delle piattaforme è IOS Safari, e questo è dove ho riscontrato un problema. Nel mio codice allineo due pulsanti mobili alla parte inferiore di un div con una larghezza e un'altezza del 100% Funziona tutto bene e i miei pulsanti appaiono esattamente come dovrebbero essere in fondo alla pagina. Tuttavia quando clicco sui pulsanti, la vista compatta da Safari Safari passa a visualizzazione completa ei miei pulsanti sono nascosti dietro la barra di navigazione in basso!

È normale che Safari Mobile visualizzi il menu espanso quando l'utente tocca il 10% inferiore dello schermo? Come posso evitare questo?

In questa gif puoi vedere il problema sul simulatore IOS:
Come puoi vedere il problema si verifica solo quando un pulsante si trova nel 10% inferiore della vista. Questo è solo un pulsante normale, il mio codice è stato controllato da più sviluppatori e non ha errori.

    
posta dennismuijs 15.05.2014 - 10:05
fonte

2 risposte

6

Questo è un comportamento normale in Mobile Safari, toccando in basso verranno visualizzate le varie opzioni del browser e scorrerà la pagina web di conseguenza. La funzionalità della pagina Web rimane la stessa, quindi l'utente può ancora toccare il pulsante dopo averlo fatto scorrere per accedere a qualsiasi funzionalità abbia.

    
risposta data 15.05.2014 - 10:27
fonte
5

Penso di aver trovato una risposta. Impostazione dei contenuti per avere i seguenti stili:

  • height: 100% (consente al contenuto di riempire il viewport e andare oltre il fondo)
  • overflow-y: scroll (consente di scorrere sotto la finestra, il valore predefinito è visible )
  • -webkit-overflow-scrolling: touch (per smussare qualsiasi comportamento di scorrimento)

sembra forzare la visualizzazione del menu iOS in Safari. In questo modo, i clic sui pulsanti funzioneranno invece di aprire il menu di Safari. Spero che questo aiuti!

    
risposta data 12.12.2015 - 02:45
fonte

Leggi altre domande sui tag