user1613797
user1613797

Reputation: 1267

Mobile HTML: keep scrolling after touch is ended

I created a HTML list that I show on mobile devices:

<ul>
    <li>...</li>
    ...
</ul>

When I touch display and start moving my finger this long list will be also scrolled. However, what I want to achieve is that when I move my finger away from the screen, this list should still scrolling for a moment. If you start iPhone 5S native email client, you can see such effect.

Right now, if I move my finger from the screen, iPhone stop scrolling immedeately and it doesn't feel good from usability point of view.

A CSS solution would be the best one because I try to reduce the amount of javascript code used in my mobile apps.

Upvotes: 0

Views: 512

Answers (1)

myajouri
myajouri

Reputation: 3114

Try:

body {
    -webkit-overflow-scrolling: touch;
} 

If your list is in a different scrolling container, then add -webkit-overflow-scrolling: touch; to that container as well.

Upvotes: 1

Related Questions