Chrome Browser for Android no longer supports -webkit-overflow-scrolling? Is there an alternative?

android, google-chrome, overflow, scroll, webkit

Solution

Try adding `z-index: 0` to the element with `overflow: scroll` to create a stacking-context that provides a hint to Chrome to use the fast-scrolling code path.

Background:

I am currently experiencing this issue after updating to the latest version of Chrome for Android. This was also compounded for me by the fact that due to this change the current Modernizr test for this feature now returns false, so my CSS styles were not being applied.

Digging around I found another issue that discusses the support for overflow scrolling touch:

Tien-Ren observed while debugging 162363 that -webkit-overflow-touch is an inherited property. So the behavior of setting `z-index: 0` on all non-hidden elements with that property creates a cascade of stacking contexts below it. (This behavior, behind ENABLE_ACCELERATED_OVERFLOW_SCROLLING, is currently enabled only on Android.) The obvious fix would be to set `z-index: 0` on only "overflow: scroll" elements.

So it would seem that if you are having issues with the scrolling not working as expected then adding `z-index: 0` to the element with overflow: scroll then this may help. However this did not work for me, although the scrolling sections worked (after I had modified the Modernizr css-overflow-scrolling test to return true for this version of Chrome) the momentum effect of the scrolling was not present.

Problem

I updated to the newest version of Chrome for Android on my Nexus 7 tablet and ... ``` -webkit-overflow-scrolling: touch ``` ... no longer works. In addition, the following evaluates to false: ``` !!('WebkitOverflowScrolling' in document.documentElement.style) ``` Was support for overflow scrolling removed from more recent builds of Chrome for Android? Is there an equivalent or comparable alternative momentum scrolling mechanism (not iScroll, etc.) that I can use found in the newest version? As well, I searched for Chrome Beta in the Play Store on my device and it does not come up in the search results. Maybe the beta version is not offered for Nexus 7 tablets? Any help on this matter is much appreciated. It's very frustrating that Google appears to have removed this feature from their browser .... edit: Detailed version information: Nexus 7 tablet running Android version 4.2.2 ``` -webkit-overflow-scrolling: touch; ``` and ``` !!('WebkitOverflowScrolling' in document.documentElement.style) ``` - Works and evaluates to true on Chrome version 18.0.1025469 - Does not work and evaluates to false on Chrome version 26.0.1410.58

Original source