posizione: fissa, ha una prestazione molto negativa sui dispositivi mobile/tablet durante lo scorrimento

Question

Sto usando position: fixed nel mio sito per correggere la barra di navigazione nella porta di visualizzazione, proprio come la barra blu di Facebook, ma quando l'abbiamo provato sul cellulare/tablet (con i loro bassi poteri di elaborazione) questa barra fissa fa un brutto colpo sulle prestazioni, il che rende un'esperienza utente pessima durante lo scorrimento,

abbiamo usato un ottimo articolo per migliorare lo scorrimento, e in effetti essi ha fatto, come:

• http://www.html5rocks.com/en/tutorials/speed/scrolling/
• http://www.html5rocks.com/en/tutorials/speed/unnecessary-paints/
• https://github.com/shichuan/javascript-patterns/blob/master/jquery-patterns/window-scroll-event.html

Dopo un sacco di modifiche in base a questi articoli, abbiamo raggiunto il punto in cui position: fixed è l'unica indagine lasciato per noi per migliorare in.

Il sito ha un ultra-liscia scorrendo quando lo cambiamo in position: absolute. Ma con il suo aggiustamento, lo scrolling ha un pessimo inconveniente nella misura in cui potrebbe bloccare il browser safari su ipad quando si scorre in un certo modo, sapevi come usare position: fixed con una buona prestazione su tablet/dispositivi mobili?

Answer 1

Se i "tablet/dispositivi mobili", che hanno problema di prestazioni, hanno un motore Webkit che probabilmente potrebbe trovare risposta qui: Chrome slow scrolling with fixed position elements

Risposte rapide: tenta di aggiungere -webkit-transform: translateZ(0); sul blocco fisso.

Answer 2

Al fine di ottenere uno scorrimento uniforme nel dispositivo mobile, anche quando avendo "position: absolute",

è sufficiente aggiungere al Div l'attributo CSS

"-webkit-trabocco a scorrimento : tocco; "