Copy link to clipboard
Copied
Lightbox++ opacity overlay fails beyond the viewport, but expands in Chrome devtools mobile view on return key press. Can js mimic this on mobile?
I’m using lightbox++ on my site, when viewed on mobile devices, if the user clicks on an image and scales it up, the area outside the viewport remains white instead of being covered with the opacity overlay.
I’ve noticed on Chrome developer tools mobile view, when I press the return key, it does some sort of "soft refresh" (it doesn’t reload the whole page, only the lightbox, somehow), which then surprisingly expands the entire overlay over the outside viewport area, just the way I would like it to behave.
So it begs the question, can I force that to happen with javascript?
I want that behavior to happen on each instance of the image being clicked on, then loaded, then the return key "pressed", thus the lightbox reloaded, etc., in order to ensure the overlay is always over both the viewport and outside the viewport area.
Link to the test site:
https://www.solarinkgraphics.com/index_TEST003.html
Chrome dev mobile view, pre return key press.
https://i.stack.imgur.com/HHDve.png
Chrome dev mobile view, post return key press.
https://i.stack.imgur.com/AoI2N.png
View on the actual mobile device.
https://i.stack.imgur.com/H76YZ.png
Copy link to clipboard
Copied
I would advise using a different lightbox, the one you are currently using is dated.
It's setting the width of the 'overlay' in px to the width of the browser window when opened, so consequently when you adjust the browser window it stays at the original width. It also uses a repeating png background image to create the grey background (sorry I fell off my chair laughing a lot at this stage). It also doesnt appear to be responsive.
It may have been partially ok 15 years back but today its irrelvant.
Copy link to clipboard
Copied
Okay so which lightbox would you recommend that would solve this and be resposive.
Copy link to clipboard
Copied
Okay so which lightbox would you recommend that would solve this and be resposive.
By @Bewitched_Marvel5D10
As I don't use 'plugins' myself (I write my own code) it's difficult to make a suggestion. Maybe someone like Nancy could make some suggestions as I'm completely out of touch when it comes to 3rd party code solutions.
Copy link to clipboard
Copied
I already answered this on Sept. 5 in your other thread on what is essentially the same topic. You have conflicts with older scripts because they are woefully outdated and need replacing.