Fixing -webkit-overflow-scrolling when overlaid by element

November 21st, 2011
Nikolai Onken

It is amazing that we finally are able to use some sort of overflow: scroll; on iOS – I seriously wish we had this two years ago when we were fighting battles to make such stuff happen ;)

Even though -webkit-overflow-scrolling: touch; works like a charm (at least in the scenarios I encountered), there is one scenario which seems to be broken:

When placing an element on top of an element with -webkit-overflow-scrolling: touch; enabled, the element above the scrollable element does not cancel scrolling behavior, which can cause some seriously confusing interactions.

To work around this, or give you a jumpstart where to look at until this works properly, take a look at following video:

Comments

Just for the record: the correct name of the property is -webkit-overflow-scrolling (-ing!)

1

November 29, 2011 — 03:06 pm
Philipp Bosch

Hi Philipp, thanks for the hint, fixed!

2

November 29, 2011 — 05:32 pm
nonken

Leave a Reply