Site logo

Archived topic

Make pop up active window locking down background

9 replies · Started by Steig on May 8, 2019

Viewing posts 1–10 of 10

Hello,

The site I'm building is meant only for people on phones to view it. I have popups that show info, but find that people are accidentally clicking on surrounding space causing the background to be active and scroll, while the popup just sits there.

Is it possible to make it so that when a popup is active, the background is just locked down and won't accept clicks? Then when the popup is closed, control is returned to the background, which at that point isn't the background anymore, it's the foreground or main focus.

Thanks

Hi there,

I'm not 100% sure if I understand but I'm not aware of a way to "lock down" the background.

Any example you can provide to show how you want it to work?

Let me know :)

I've been looking for sites to provide an example and haven't found any so far. What I'm trying to do is make the active window the only window that will take input. So when the popup is active, the main window, which is behind it, but still visible around the edges, won't scroll if someone fat fingers it and clicks on it. Users are viewing the site only through mobile phones.

Hi there,

i can't currently access the site you provided a link for. Can you check the URL?
Would need to see the site to see if the popup you have adds a class to the body when its open then we may be able to help with some CSS to stop it from scrolling.

Sorry I mistyped the URL. It's been updated.

Are you testing this on an iPhone by any chance?

Three different iPhone models; yes.

Yep :) The modal actually adds the code to stop the background scroll, just doesn't stop the 'wobble' on iPhone.
Try adding this CSS:

.sgpb-overflow-hidden {
    position: fixed;
}

That took care of the problem. Thank you!

Awesome - glad to be of help.

This archived topic is closed to new replies.