Disable overscroll in iOS Safari
19,874
Solution 1
This way will allow scrollable elements while still preventing the overscroll in the browser itself.
//uses document because document will be topmost level in bubbling
$(document).on('touchmove',function(e){
e.preventDefault();
});
//uses body because jquery on events are called off of the element they are
//added to, so bubbling would not work if we used document instead.
$('body').on('touchstart','.scrollable',function(e) {
if (e.currentTarget.scrollTop === 0) {
e.currentTarget.scrollTop = 1;
} else if (e.currentTarget.scrollHeight === e.currentTarget.scrollTop + e.currentTarget.offsetHeight) {
e.currentTarget.scrollTop -= 1;
}
});
//prevents preventDefault from being called on document if it sees a scrollable div
$('body').on('touchmove','.scrollable',function(e) {
e.stopPropagation();
});
Solution 2
This Should be the easiest way to accomplish this:
$(function() {
document.addEventListener("touchmove", function(e){ e.preventDefault(); }, false);
});
Hope this helps.
Best.
Author by
keepyourweb
Updated on June 11, 2022Comments
-
keepyourweb almost 2 years
How can I prevent overscroll in Safari iOS? I would use the touch gesture for navigate on a site but I can't.
I tried this:
$(window).on('touchstart', function(event) { event.preventDefault(); });
But in this way I disabled all gesture, infact I can't zooming with pinch-in and pinch-out.
Any solutions? Thanks.