scroll-up-bar
scroll-up-bar copied to clipboard
jumpy behaviour on iPhone
On my iPhone (4s), the scroll up bar behaves a little bit jumpy.
First off; when I scroll down fast (not even very fast), without any intervals, the top bar does not disappear. Only when I stop scrolling, the bar disappears, while I expect the top bar to hide as soon as I scroll down.
When I scroll down, and immediately up, the top bar sometimes appears but from the middle of the page, as if it were flying around the page.
I'm currently working on some improvements and I'll definitively give priority to this and implement proper touch support. Thanks for the detailed report.
Awesome, thanks!
From what I've understood from this discussion at StackOverflow (http://stackoverflow.com/questions/2863547/javascript-scroll-event-for-iphone-ipad) is that scroll events are handled different by iPhone. I tested more "scroll up menu's" and most of them behave like yours; i.e. while scrolling down, the menu does not disappear (as the 'scroll' event is not triggered until the user has finished "swiping").
In the meantime I will try and use Hammer.js to capture typical touch events like drag, swipe etc.
I couldn't find a way to simulate momentum scroll on iOS. I ended up adding a specific simplified fallback implementation for iOS. See ef6678a61aa54b2cc357d3d9089a04dfa0da5a24.
Now if you try the plugin on your iPhone or iPad it will behave a little different:
- the bar's state (hidden or revealed) won't change during scroll;
- only when the user stops scrolling the bar will hide / reveal depending on scroll direction;
In of the comments it is mentioned that
detecting the top of the viewport on the iphone/ipad only works with window.pageYOffset and not document.body.scrollTop||document.documentElement.scrollTop like every other browser/hardware > in existence
so I have a feeling the problem lies in there. Will also try to look at this myself later this week!
The scrolling Y position seems to be working on iOS7. The problem is we need to manipulate DOM during scroll and according to jQuery Mobile iOS devices freeze DOM manipulation during scroll, queuing them to apply when the scroll finishes. So, even touchmove
will be ineffective for updating the bar position during scroll.
I'm reopening the issue for further thoughts.