Changing a script

Design help General
1

Hi, I am using this script to prevent the body from scrolling when the modal is on. It works also on iOS devices.

The only problem is that I can only apply it to one modal because it’s based on #id, and I can’t use multiple #ids. Since I have many modals I need help to change the script in the part that says:

var _overlay = document.getElementById(‘overlay’);

so it will effect a specific class (for example .overlay or .modal-wrapper)

can anyone help me to tweak the script inside Before tag?

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

@Giuseppe use document.getElementsByClassName(‘your-class-name’);

3

it didn’t work. can you have a look at the website?

4

@Giuseppe can you send a published page link?

5

It actually works now. the only problem is when I’m on a touch device and touch outside the modal (the background moves). this doesn’t happen on the desktop.

I think it’s related to the “disable body from scrolling”…maybe the script needs some sort of option that disable also the touch scroll?

the published page is:

http://giuseppe-bufalo.webflow.io/archviz

6

@Giuseppe it works on my iPhone, I can’t see the rest of the body, so no scrolling occurs.

I’m not super familiar with the script you are using, but have used this script with a lot of success in the past:

You do have a console error as well:

image