iOS 15 is out and so is the new release of Safari that brings the ubiquitous pull-to-refresh. Like it or not, single-page apps don't like that too much.
Here's how to disable it on Chrome for iPhone:
Disable Chrome's pull-to-refresh on iPhone
Any idea how to do the same in Safari in iOS 15?
The CSS overscroll-behavior-y: contain
has no effect.
I disabled this behaviour by setting the CSS property touch-action of the target element to none.
I disabled this behaviour by setting the CSS property touch-action of the target element to none.
touch-action:none;
https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action
Very crude solution that worked for our use case is to set an overflow: hidden;
to the body element, but then you need to have an overflowing container element for all the content, otherwise scroll is blocked.
<body>
<div id="container"> Content </div>
</body>
body {
overflow: hidden;
}
#container {
height: 100vh;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With