If you view a website via mobile Safari and you scroll up to the very top, it will show the address bar.
On my website I must use iScroll which works great so far but when I scroll up, it won't show the address bar because iScroll only fakes scrolling within an own <div> element without using the browser's native scrolling behaviour.
For the user, this is a usability nightmare though because then the only way to show the address bar is to tap the thin black bar on the very top of the iPhone screen and I noticed that some users don't know this.
So, I thought, maybe there is a way to programatically show the address bar when the user has scrolled to the very top of the iScroll container?
For iOS version 5+ I found this solution to simply replace iScroll: http://damien.antipa.at/2012/10/16/ios-pull-to-refresh-in-mobile-safari-with-native-scrolling/
The basic idea is to use:
<div class="scrollable">
Foo
</div>
.scrollable{
overflow-y:auto;
-webkit-overflow-scrolling:touch;
-webkit-transform:translateZ(0);
}
This does the trick. For older iOS versions (4 and lower) there is no solution for this problem (at least I couldn't find any).