html - Issues with touch scroll on iOS when focusing inputs

Question

I am having some issues with a scrollable div on iOS. When trying to scroll by touching outside an input, it scrolls ok without any problem but when I try to scroll and I touch an input to start scrolling (there are a lot of chances that it happens because it is a div with a lot of inputs) it scrolls the whole window instead scrolling the div. I don't have that problem either in desktop or Android. I found a similar question (iOS HTML Input Tag Stops Scrolling in Scrollable Element) but it doesn't have any answer either. While I don't find any good solution, I decided to prevent the event touchmove when the user touches an input, but it is not exactly what I want.

Maybe someone already faced this problem and can help. I would really appreciate it, thanks in advance.

question from:https://stackoverflow.com/questions/25596960/issues-with-touch-scroll-on-ios-when-focusing-inputs

Answer 1

To get native momentum scrolling on iOS 5+, you'll need:

div {
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
}

Source: Overflow

Maybe you also need:

div > * {
    -webkit-transform: translateZ(0px);
}

Source: Similar question in Stack Overflow

Source 2: Another similar question