Jump to content

How to be able to pinch and zoom. only on gallery images with lightbox on. In my Squarespace website

Recommended Posts

Hello everyone, I built this website for my business and we have a few pages as portfolio items. I have lightbox activated when you click on any of the gallery images below the main header one. It looks great on a computer but on a mobile device one isn't able to pinch and zoom in on the images in the gallery on the smartphone. 

What would the code look like to make it possible to zoom in on gallery images with Lightbox?. 

I've tried using Chatgpt to write code but what it gave me to put into the custom CSS didn't work. I would really appreciate some help. 

https://www.zampolin.com/mixed-use/new-portfolio-item-b3ezg-d2r5y-w9w5e

Edited by ZAMPM
added link
Link to comment

You can use Lightbox Plugin (affiliate link) or this link (non-affiliate link) to do this. It has an option to enable pinch zoom on mobile

You can see a quick demo here: https://tuanphan.squarespace.com/gallery-grid-section-pinch-zoom?noredirect

pass: abc

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!)

Link to comment
On 11/10/2023 at 12:29 AM, ZAMPM said:

Hello everyone, I built this website for my business and we have a few pages as portfolio items. I have lightbox activated when you click on any of the gallery images below the main header one. It looks great on a computer but on a mobile device one isn't able to pinch and zoom in on the images in the gallery on the smartphone. 

What would the code look like to make it possible to zoom in on gallery images with Lightbox?. 

I've tried using Chatgpt to write code but what it gave me to put into the custom CSS didn't work. I would really appreciate some help. 

https://www.zampolin.com/mixed-use/new-portfolio-item-b3ezg-d2r5y-w9w5e

Lightbox Studio support this out of the box, you can open this link on mobile to see it in action

Edited by Beyondspace

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.