timjphoto Posted March 31, 2022 Posted March 31, 2022 Site URL: http://www.timjobling.co.uk Hi, I've done a search of the forum and not come up with and answer to this. I was wondering if anyone has any css to enable images in a lightbox to be close by clicking outside the image rather than on the small x. I'm having an issue with my site where the x isn't visible due to my floating header, I've made it larger but it still doesn't look great! Many thanks in advance, Tim.
tuanphan Posted April 2, 2022 Posted April 2, 2022 Hi. CSS can't solve this problem If you use a Business Plan or higher, let me know, we will try some JavaScript code timjphoto 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
paul2009 Posted April 2, 2022 Posted April 2, 2022 On 3/31/2022 at 12:46 PM, timjphoto said: I was wondering if anyone has any css to enable images in a lightbox to be close by clicking outside the image rather than on the small x. Squarespace has a click event that allows users to navigate between images by clicking on the left or right of the lightboxed image to move backwards or forwards through the gallery. Because of this, they don't allow users to click outside the image to close the lightbox. A workaround may be to reposition the close button so that it is not hidden by the header: You could do this with some CSS like this, adjusting the values to meet your needs: .collection-type-gallery #backToThumbs { top: 134px; right: 44px; } Did this help? Please give feedback by clicking an icon below ⬇️ timjphoto 1 Me: I'm Paul, a SQSP user for >18 yrs & Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥. Work: Founder of SF.DIGITAL. We provide high quality original extensions to supercharge your Squarespace website. Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links. Forum advice is completely free. You can thank me by selecting a feedback emoji. Buying a coffee is generous but optional. 🤒 I'm currently in hospital and may not respond quickly to your posts.
timjphoto Posted April 2, 2022 Author Posted April 2, 2022 @tuanphan I am on a business account so if there is some JavaScript code that would be amazing. Many thanks, Tim.
timjphoto Posted April 2, 2022 Author Posted April 2, 2022 @paul2009 Thanks very much for your reply. The code works well, however I think I would prefer the click outside image option. My site seems to do a strange thing where clicking on the x to close images brings up a cursor on my navigation. I also don't mind losing the function to move back and forward between images. Many thanks, Tim.
yako_ Posted February 15, 2023 Posted February 15, 2023 On 4/2/2022 at 5:53 PM, timjphoto said: @tuanphan I am on a business account so if there is some JavaScript code that would be amazing. Many thanks, Tim. Hi there, I'm interested in this as well. Is there a Javascript that did the trick? I'd appreciate to receive that, too.
Sitar Posted August 7, 2023 Posted August 7, 2023 I would also be interested in the Javascript, many thanks!
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment