Prevent lightbox from closing

Ask the community
,
1

Hi, I need users to select options in the lightbox, so I have my own button, which submits the data and closes the lightbox.

I have disabled the default closing (X) button and disabled the background overlay for closing as well. However there is still option of pressing ESC on the keyboard and the lightbox closes itself. I need to prevent this.

Is there any way?

Thank you

2

Interested in this as well… it seems to be a “no” as of June 2020, where a wishlist submission was suggested. https://www.wix.com/velo/forum/coding-with-velo/prevent-the-lightbox-from-turning-off-except-the-close-button-preventing-closing-by-clicking-anywhere-except-esc-or-message

3

If you have a premium account (i.e. an account under your domain and not under wixsite.com)..) You can do the following:

  1. Go to the site dashaboard.

  2. Click Settings

  3. Click Custom code

  4. Create a new custom code, put in the following code, apply to the light-box, and set it to be at the body end :

<script>
try {
const lightbox = document.getElementById('popups-wrapper');
lightbox.addEventListener('keydown', e => {
if(e.keyCode === 27){
e.preventDefault();
e.stopPropagation();
}
});
lightbox.addEventListener('keypress', e => {
if(e.keyCode === 27){
e.preventDefault();
e.stopPropagation();
}
});
} catch{}
</script>

IMPORTANT: Since it’s a workaround, Wix may change things in the future and the code might get broken.

2 Likes
4

P.S. It will only work on live sites (you won’t be able to see it on review mode).

5

To make it work, I had to change the element to SITE_CONTAINER, because popups-wrapper is not present untill the lightbox pops up…

But that way it’s working, I added the script specifically to the only page I need it on.

Thank you very much. This is also creative way of doing other things outside of API scope…

6

Maybe you didn’t set it to be at the body end or maybe you didn’t apply it to the lightbox (where you select the page for this code, you can select the lightbox itself).
Anyway, if it works with SITE_CONTAINER that may be even better.

7

Oh, I didnt realize I can select the lightbox as a specific page for script to be applied to. In that case your solution is indeed 100% correct. :slight_smile: Thank you.