lightGallery icon indicating copy to clipboard operation
lightGallery copied to clipboard

.lg-img-wrap opacity & scale incorrect when active

Open joepagan opened this issue 8 months ago • 1 comments

Description

After updating from lightgallery 2.4.0 to 2.7.2: When I click a gallery item, the lightbox loads, but, the item itself is hidden, revealing just the spinner gif.:

image

It appears the .lg-item element is fine, but the .lg-img-wrap child element has opacity: 0 & scale(0.5, 0.5, 0.5) on it.

image

I have to force this resolution with:

.lg-img-wrap,
.lg-video-cont {
  opacity: 1 !important;
  transform: scale3d(1, 1, 1) !important;
}

Steps to reproduce

Clear steps describing how to reproduce the issue. Please link to a demo project (Your website URL, codepen, or jsfiddle) if possible.

JS code that you use to initialize lightGallery.

lightGallery(document.getElementById('lightgallery'), {
    ... settings
});

Sample HTML markup

<div id="lightgallery">
    <a href="img/img1.jpg" data-lg-size="1600-2400">
        <img alt=".." src="img/thumb1.jpg" />
    </a>
    <a href="img/img2.jpg" data-lg-size="1024-800">
        <img alt=".." src="img/thumb2.jpg" />
    </a>
    ...
</div>

am I missing something obvious here?

Environment

  • Browser and version - chrome 125
  • OS - macos 14.4.1
  • lightGallery version - 2.7.2

joepagan avatar Jun 12 '24 11:06 joepagan