I would like to disable the iOS overscroll in a webapp but still allow the body to be scrolled.

$(document).on('touchmove', function(e) {
    e.preventDefault();
});

disables scrolling altogether (as one would expect).

Is there a way to do what I want to do?

I would like to disable the iOS overscroll in a webapp but still allow the body to be scrolled.

$(document).on('touchmove', function(e) {
    e.preventDefault();
});

disables scrolling altogether (as one would expect).

Is there a way to do what I want to do?

• javascript
• jquery
• html
• ios
• web-applications

• It is an answer to a related question, though it covers this issue as well, stackoverflow./questions/2890361/…. – Gajus Commented Nov 11, 2014 at 0:02
• I have found this script which fix this problem! :) github./lazd/iNoBounce – Jan Šafránek Commented Nov 15, 2015 at 10:26

2 Answers 2

I had pretty much the same issue. This should help you:

// Disable overscroll / viewport moving on everything but scrollable divs
 $('body').on('touchmove', function (e) {
         if (!$('.scrollable').has($(e.target)).length) e.preventDefault();
 });

document.body.addEventListener('touchmove',function(e){
     if(!$(e.target).hasClass("scrollable")) {
       e.preventDefault();
     }
 });

Try this i just got in via google