Cordova/Phonegap – Native style (rubber banding) Scrolling – iOS 11+


I have taken over development of a production app created in Cordova (Phonegap). I am currently trying to make the app more ‘native’ as in creating a more native looking style and am trying to start off with the ‘rubber-band’ style scrolling as common in most native applications. I understand that ionic has all this built in but I am not familiar with Angular nor do i want to convert the whole app to ionic.

Below is a link to a GIF of the expected outcome (demo ionic view app):

By editing the config.xml to

<preference name="DisallowOverscroll" value="false" />

the rubber banding exists but affects the whole app, including the status bar and background, making it look even more like a typical hybrid app. I have tried appending CSS positions to the css making the status bar fixed and everything else normal with no success.

I have also tried a few plugins namely ‘iscroll.js’ and ‘bouncefix.js’ following their guides but still nothing seems to work. It seems either to be static or over elastic.

I have browsed through Stack overflow already to try and find a solution, but no modern working one exists. If there is a plugin or javascript fix which could make this possible on Cordova 4.5+ without the use of Angular and Ionic then that would answer my question.

Due to the nature of the app, i can’t post large code samples but hopefully the above makes sense.


Looking for a way to have elastic scrolling on some but not all elements of a phonegap build cordova app (not ionic). See: for expected outcome.


Hi pfg, thanks for the comment. Using DisallowOverscroll = false causes the entire document to exhibit rubber band scrolling, I am looking for only affecting specific divs (or wrappers) to rubber band.
– Matthew M
4 mins ago