Select Page
Momentum Scrolling on iOS Devices
Momentum Scrolling on iOS Devices

Normally when you add overflow:scroll to an element with fixed height and width, the scroll-bar appears in desktop and mobile devices to scroll through the hidden part of the content. In iOS devices, they have momentum scrolling which in default is disabled for web pages with scroll bars. Adding the following script will make it fluid.

CSS

.element {
  width: 300px;
  height: 200px;
  overflow-y: scroll; /* has to be scroll, not auto */
  -webkit-overflow-scrolling: touch; /* add this to the element you need momentum scrolling on */
}

Yes, thats it. It was simple.