scrollmobile-safarivertical-scrollingmobile-webkit

-webkit-overflow-scrolling:touch and 'Tap status bar to scroll to top'


Navigate to this fiddle on an iPhone and notice that even though there is a -webkit-overflow-scrolling:touch declaration, the 'tap to top' feature still works. This was tested on an iPhone 4 running iOS 6.1 and an iPhone 4S running iOS 5.0.1.

This test raises the question: does declaring -webkit-overflow-scrolling:touch affect the 'tap status bar to scroll to top' behaviour in iOS?


Solution

  • If you put -webkit-overflow-scrolling:touch on any element other than document.body, it will break the default tap status bar to scroll to top behaviour.

    There is a tiny script on GitHub, that works as a replacement for the missing scroll to top of iOS overflow scrolling. You can put it on your apps header to achieve nearly the same result.