Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

area list and people list lack momentum scrolling on iOS devices #48

Closed
zarino opened this issue Sep 3, 2015 · 1 comment
Closed

area list and people list lack momentum scrolling on iOS devices #48

zarino opened this issue Sep 3, 2015 · 1 comment

Comments

@zarino
Copy link
Member

zarino commented Sep 3, 2015

The area I can scroll in on a phone or tablet is quite small, and it's made painfully hard by the fact that momentum scrolling doesn't work, so I can literally only drag the area list or people list up a little bit at a time.

To enable momentum scrolling on iOS, your element needs to have overflow: scroll and -webkit-overflow-scrolling: touch.

But we currently use overflow: auto to only add scrollbars if they're required. Since the SeePoliticiansTweet UI includes a lot of full-height vertical panels, it would be a shame to force scrollbars to appear on all of them even if there were nowhere to scroll to (which is what overflow: scroll does).

-webkit-overflow-scrolling: touch does not work with overflow: auto.

One solution might be to set overflow: scroll if we know the user's device renders invisible scrollbars (like iOS and modern OS X). Since the scrollbars are invisible, overflow: scroll will look exactly the same as overflow: auto, so it should all look and feel very natural. You can detect vertical scrollbars by comparing scrollable element’s clientWidth to its offsetWidth – it's a bit hacky but it works.

@zarino
Copy link
Member Author

zarino commented Oct 6, 2015

Pull request here: #78

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant