Atualmente, estou desenvolvendo um aplicativo Web usando html5 e jQuery para iPad Safari. Estou com um problema no qual grandes áreas de rolagem fazem com que os elementos que estão fora da tela apareçam após um atraso quando eu os deslizo para baixo.
O que quero dizer com isso é que, se eu tiver uma linha de imagens (ou mesmo uma div com um gradiente) fora da tela, quando eu rolar para baixo (ou para cima), o comportamento esperado é que o elemento apareça na tela como Estou rolando para ele.
No entanto, o que estou vendo é que o elemento não aparece até eu levantar o dedo da tela e o scroller terminar todas as suas animações.
Isso está causando um problema super perceptível para mim, fazendo com que tudo pareça instável, embora não seja. Suponho que o iPad Safari esteja tentando fazer algo para economizar memória. Existe alguma maneira de impedir que isso aconteça. Além disso, também gostaria que alguém pudesse esclarecer o que o iPad Safari está realmente tentando fazer.
<svg>
elementos que exibiam desenho / renderização atrasada semelhante. Infelizmente, isso *:not(html) { ... }
levou a todos os tipos de comportamentos estranhos, como o @JonathanTonge apontou que pode ocorrer. No entanto, selecionar apenas os <svg>
elementos e usar translate3d(0, 0, 0,);
parece ter resolvido meus problemas de rolagem.