To pytanie ma już odpowiedź tutaj:

Ostatnio pracuję nad aplikacją mobilną. Optymalizuję przede wszystkim na urządzenia mobilne, koncentrując się teraz na iOS na iPhone'a. Nie chcę dokładnego wyglądu natywnej aplikacji, ale myślę, żeuczuci bycia rodzimym ma absolutne znaczenie. Zrobiłem znaczniki i CSS, aby odzwierciedlić ten pomysł, zostawiając mnie z tym (adnotacja, aby lepiej zrozumieć problem, który mam później):

To wszystko działa bezproblemowo, a ponadto ma tę zaletę, że ma natywny charakter, ze statycznym nagłówkiem i stopką oraz przewijalnym widokiem wewnętrznym (dzięki-webkit-overflow-scrolling: touch).

Każdy, kto korzysta z iOS przez ponad 5 minut, będzie wiedział, że przewijanie w górę lub w dół powoduje przewijanie. Ponadto, gdy trafisz na górę listy, uzyskasz ładny efekt „odbicia”:

Wydaje mi się, że to pomaga zdefiniować atmosferę iOS, a tak mały szczegół może przejść długą drogę. Na szczęście, gdy znajdziesz się poniżej górnej części listy w przewijalnym elemencie w aplikacji internetowej i przewiniesz górę, uzyskasz ten sam efekt. To jestpożądane zachowani w akcji:

Jednak gdy jesteś na górze listy i próbujesz odtworzyć to samo zachowanie podskakujące na górze listy (à la Setting.app, patrz wyżej), otrzymujemy następujące zachowanie, które jestniekorzystane:

Widziałem trochępodobn pytani w przypadku przepełnienia stosu, ale wszystkie te opcje wyłączają odbijanie. Zastanawiam się, czy w ogóle możliwe jest utrzymuj podskakiwanie, ale zawsze spraw, aby wystąpiło nabody section section#main, nie w chrome @ aplikacji internetow. Nie używam jQuery, więc wolałbym, aby odpowiedzi były w prostym JavaScript (choć punkty bonusowe za rozwiązanie CSS).

Tutaj jestGitHub repo z całym kodem (Sinatra, HAML i Sass; obecna gałąź toso) lub a JSFiddle z uszkodzonymi obrazami i linkami, ale pokazuje problem na iPhonie (najlepiej dodać go do ekranu głównego, aby go przetestować