javascript - How to disable inertial scrolling on body for iOS browsers?

Question

I need to disable the inertial scrolling on the body element for iPad, but keep the ability to scroll the page without the inertia.

I have been looking for some time but I haven't found any good solutions. Maybe I am just not looking for the right thing? Is there any hack or workaround that could make this possible?

Answer 1

Add this to the body element's CSS:

-webkit-overflow-scrolling: auto;

The default for -webkit-overflow-scrolling is touch. That tells iOS devices to use "inertial" scrolling. The docs: https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-overflow-scrolling

@meuwka answer achieves your goal, but in a roundabout way—it works because div elements have -webkit-overflow-scrolling: auto; as their default.