Posizionamento fisso per i browser mobili

Question

Sul sito mobile che sto costruendo, ho bisogno che l'intestazione superiore rimanga fissa.

sono consapevole della soluzione posizione fissa per Safari Mobile come si vede qui:

http://doctyper.com/archives/200808/fixed-positioning-on-mobile-safari/

ho provato e funziona bene. Tuttavia, mi chiedevo se esiste una soluzione unica che funzioni per tutti i principali browser per smartphone di smartphone. Nota: non ho bisogno che il piè di pagina rimanga fisso, solo l'intestazione superiore. Quindi questo dovrebbe rendere più facile l'adattamento per tutte le dimensioni dello schermo mobile, dal momento che dovrei semplicemente impostare la parte superiore del div su 0 onScroll.

Grazie!

Answer 1

Aggiornamento importante

Al IOS 5, posizionamento fisso funziona bene sul mobile. Allo stesso modo gli androidi lo supportano.

---

Vecchio risposta

Credo iScroll è la soluzione più attivamente sviluppata, supporta Android

Ma ci sono alcune cose da guardare fuori per:

1. Abilitando questo hack si disabilitano le funzioni a cui le persone sono abituate ad apprezzare lo zoom.
2. Aggiunge molta complessità alla soluzione.

Per queste ragioni jQTouch deciso not to use it:

Non è un problema. Non è attualmente supportato in jQTouch. Non sei sicuro di come siate familiari con lo , ma il problema principale qui è che Safari mobile non ha la posizione di supporto : risolto. Alcune persone hanno lavorato alle implementazioni di , in particolare Cubiq e Doctyper. Entrambi si sentono male a me, quindi, perché non faccio per impostazione predefinita, ma sei libero di provare a fare un un'estensione che it- supporta

Personalmente quando si tratta di cose che ha bisogno di posizionamento fisso su un iPhone preferisco andare con il posizionamento statico e solo lo scorrimento automatico verso il basso/in alto quando si modifica il contenuto in modo dinamico.

Answer 2

In seguito al collegamento pubblicato da Sam Saffron, sembra che una nuova versione di iScroll (versione 4) abbia risolto alcuni dei problemi elencati da Sam.

iScroll-4

Oltre a tutte le funzioni iScroll precedenti, versione 4 introduce:

• Pinch/Zoom
• Pull up/down per aggiornare
• Migliorata la velocità e la quantità di moto
• Snap all'elemento
• barre di scorrimento personalizzabili

ho solo guardato le demo sul loro sito, quindi non posso garantire per esso, ma si guarda bene!

Answer 3

Ho affrontato lo stesso problema per più di due settimane. E questa soluzione ha funzionato per me. Basta includere

-webkit-backface-visibility: nascosto;

nel css dell'elemento insieme alla posizione: fissa.

Si lavorerà bene