Streaming live at 10am (PST)

Disable body when clicked on popup from collection

#1

Hi Guys,

I found the perfect solution from @cyberdave on how to disable the body scroll when a modal is clicked on. However I have a modal that appears from a collection. So I have team members that you can click on and clicking on them appears a modal. When clicked on the scroll on the body of the page needs to be disabled.

Here is my read-only link:https://preview.webflow.com/preview/zdhc?utm_source=zdhc&preview=c25171830782a381d45237850fe6b78e

It’s on the ‘about’ page, and then the meet the team section. I’ve got @cyberdave 's code still in the project and the body does stop scrolling when clicked on the first item. But it doesn’t on the second, third etc. and the body is also not getting scrollable when clicking on the close-modal.


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

#2

Just target class instead of id in your script. So instead of $('#open-modal') use $('.team-link'). Same for the close button.

There can only be one element with unique id on your page.

1 Like
#3

Awesome @dram. Thanks a lot this did the trick.