2

I am trying to disable the elastic scrolling/bounce that is caused when pulling down from the top of an iOS Safari Page or vice versa at the bottom.

I have tried a technique below which I have seen people have said works but hasn't worked so far for me:

html,
body {
    width: 100%;
    height: 100%;
    overflow: hidden;

    #ios-scroll-wrapper {
        overflow: auto OR scroll;
    }
}

Is this something that is not able to be disabled now on iOS Safari? It's quite annoying to have as I have a fixed header/navigation at the top of the screen and pulling the page down causing the elastic scroll to either pull all content down apart from the header or with the above fix it will pull the content down and the header will disappear.

EDIT: Just as an FYI, this page/site is not using PhoneGap and a lot of solutions I have looked at so far use PhoneGap.

ChronixPsyc
  • 478
  • 1
  • 8
  • 22
  • possible duplicate of [Disable IOS Safari Elastic Scrolling](http://stackoverflow.com/questions/23862204/disable-ios-safari-elastic-scrolling) – karlingen Jun 24 '15 at 08:23

1 Answers1

-1

Try this:

overflow-y: scroll;
-webkit-overflow-scrolling: touch;

As stated at Css-tricks

Gustaf Gunér
  • 2,272
  • 4
  • 17
  • 23
  • "-webkit-overflow-scrolling" seems to deal with the fast flick smooth scrolling you get on mobile. I haven't found any CSS way to stop the bounce/elasticity thing. There are JS solutions out there which is annoying – Francisc0 Sep 06 '17 at 18:03