Last active
May 8, 2024 17:47
-
-
Save amolk/1599412 to your computer and use it in GitHub Desktop.
Remove rubberband scrolling from web apps on mobile safari (iOS)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Remove rubberband scrolling from web apps on mobile safari (iOS)</title> | |
| <meta name="apple-mobile-web-app-capable" content="yes"> | |
| <meta name="apple-touch-fullscreen" content="yes"> | |
| <meta id="extViewportMeta" name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"> | |
| <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script> | |
| <style> | |
| html, body {margin: 0; padding: 0; overflow: hidden} | |
| </style> | |
| </head> | |
| <body> | |
| <script> | |
| document.body.addEventListener('touchmove', function(event) { | |
| event.preventDefault(); | |
| }, { | |
| passive: false, | |
| useCapture: false | |
| }); | |
| window.onresize = function() { | |
| $(document.body).width(window.innerWidth).height(window.innerHeight); | |
| } | |
| $(function() { | |
| window.onresize(); | |
| }); | |
| </script> | |
| Try pulling down this page with touch in iPhone/iPad, nothing happens! No rubberband scroll. | |
| </body> | |
| </html> |
thank you!
@mikebarnhardt, that stopped me from being able to scroll through the iframe, but now none of the page scrolls when you move your finger over the iframe.
I don't want the iframe to scroll, but I want the page to scroll.
You can verify this on RyderCragie.com where the search bar and share button is.
I tried lots of different approaches, but this was the thing that really worked: https://github.com/lazd/iNoBounce
this is the real working solution
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This works for me as well. Try this first as it's way way simpler than the alternatives.