How to remove top margin on Pop-Ups or avoid Scroll-Bounce for single-page app?

Need help Mobile
1

I’m working on a single-page app and want no scrollable movement when there’s no scrollable content.

I’d like to avoid the “rubber-banding” or “scroll bounce” effect: when the page stretches or bounces slightly beyond its normal boundaries and then returns to its original position when the user stops scrolling.

I noticed I can avoid this with pop-ups, so I’m considering using them for each screen. But there’s this annoying space above the pop-up, even when I set its height to 100%. Seems like there’s a default top margin I can’t get rid of.

Any ideas on how to fix this? I’m also open to alternatives to pop-ups if they remove the scroll bounce.

Here’s a video of what I mean by scroll bounce:

2

Is the blue part of the screen in the video a popup element or just the page background?

Normally to stop scroll when a popup is displayed people use custom code, which has been shared extensively on the forum in past threads.

If it is the page background, then it looks like you are demonstrating default behavior of a mobile web browser…This can also be eliminated with some custom code

3

Correct, this is the page background not a pop-up. I’m looking to remove that bouncing scroll effect regardless of wether a pop up is visible or not. Do you know what the custom code for that is?