wilzu Posted July 4, 2022 Share Posted July 4, 2022 Site URL: http://www.xaviervoirol.ch Is there a way to change the display size of an image when it appears in the lightbox? When I click on a thumbnail, vertical images come with a size of 750 x 1125 px, but I would like them to be a bit bigger. At least a height of 2000 px or, even better, at full uploaded size (3000 x 4000 px). Actually, I need a hack to override the presence of the "?format=750w" taht appears at the end of the image URL. Link to comment
tuanphan Posted July 7, 2022 Share Posted July 7, 2022 Try adding to Design > Custom CSS .sqs-lightbox-open .sqs-gallery-design-stacked-slide img { width: 100% !important; left: 0 !important; height: auto !important; top: -100% !Important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
AKN Posted July 28 Share Posted July 28 (edited) Hello, I am trying the following code in Code Injection: <script src="https://hammerjs.github.io/dist/hammer.min.js"></script> <script> // Custom JavaScript code to enable pinch-to-zoom for Squarespace lightbox gallery document.addEventListener('DOMContentLoaded', function () { const lightboxImages = document.querySelectorAll('.gallery-masonry-lightbox-link img'); lightboxImages.forEach((image) => { const hammertime = new Hammer(image); hammertime.get('pinch').set({ enable: true }); }); }); </script> However I do not know the precise handle to select the gallery-masonry-lightbox image in the querySelectorAll. i.e. I would like to call the lightbox image, and unsure about this line in the code: '.gallery-masonry-lightbox-link img' I have also tried using the following inside the '', to no effect: .gallery-lightbox-list .gallery-lightbox-item .yui3-lightbox2 .sqs-mobile-web-content-editing My aim is to open the image in lightbox and utilize pinch-to-zoom. Any recommendations? Thanks! Edited July 28 by AKN Add atetmpts Link to comment
AKN Posted July 30 Share Posted July 30 Hi @tuanphan , any recommendation here? I added this to the things I have tried, and it also does not work: '.gallery-lightbox-item img' Thanks for any and all help! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment