closeOnOutsideClick not working on touch devices

[BentiGorlich]

Describe the bug
If closeOnOutsideClick is enabled it works perfectly on a normal desktop. On mobile this option just does nothing

Are you able to reproduce the bug in the demo site
Yes.

To Reproduce
Steps to reproduce the behavior:

1. If you're on desktop open the dev tools and activate touch emulation
2. Click on an image so the lightbox shows
3. Try clicking outside of the image
4. Nothing happens

Expected behavior
The lightbox should close when clicking outside of the image if closeOnOutsideClick is enabled on mobile as well

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop:

• OS: Fedora 41
• Browser LibreWolf
• Version 134.0.2-1

Smartphone:

• Device: Fairphone 4
• OS: iodéOS 6
• Browser Firefox
• Version 134.0.2

[felixschwan]

I was facing the same issue. By looking into HTML & CSS I recognized, that the .ginner-container has height: 100vh on screens <767px.

But even when overwriting this with height: auto the lightbox is not closing on outside click.

So I found a workaround (https://stackoverflow.com/questions/49327148/close-glightbox-gallery-by-clicking-outside-content-area) and adapted:

JS:

document.addEventListener('click', function (e) {
  const target = e.target;

  // because the .ginner-container isn't 100vh anymore we can click the slider itself
  if (target.classList.contains('gslider')) {
    document.querySelector('.gclose').click();
  }
}, false);

CSS:

.glightbox-container .ginner-container {
  height: auto;
}

[graphixela]

Have the same issue. That fix works though.