Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Image resizing issue #740

Open
ironfrown opened this issue Oct 1, 2023 · 1 comment
Open

Image resizing issue #740

ironfrown opened this issue Oct 1, 2023 · 1 comment

Comments

@ironfrown
Copy link

Lightbox2 2.11.4 on Chrome+Firefox / Ubuntu 22.04

If an image does not fit the viewport, LB2 is checking which dimension is offending and fixes it.
However, after resizing the other dimension may still be too large to fit in a viewport, requiring scrolling.

To reproduce, take any horizontal image larger than the browser window and reduce the browser height significantly,
LM2 will fit the width but the height will be clipped.

Attached below - web page before and after image click.
LM2_before
LM2_after

@faisalnjs
Copy link

I would say just use CSS to fix this easily, but sizing is definitely an issue I too encountered when using Lightbox 2, and it should be fixed. Small images need to enlarge (>= 75% of screen height) and large images need to shrink (>= 75% of screen height). Below is the CSS override I'm using.

.lb-outerContainer {
    width: 90vw !important;
}

.lightbox .lb-image {
    width: 100% !important;
    height: unset !important;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants