Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Increasing image size in Lightbox, allowing image to magnify close to the edge of browser


Celisian

Question

Hi, I have a series of images I want to display as big as possible when they go into lightbox mode. The problem is that lightbox has this black padding/margin that prevents the images from being brought right up to the edge of the browser window. Is there a custom code I can use to reduce that margin to get it as close to the edge of the browser as possible? 

I include a screenshot of one of my images in lightbox and the pink outline is how big I would like the image to be, magnified so that it comes very close to the edge of the browser. 

if this isn't possible then is it possible to somehow get the image to magnify all the way to 1:1 to act like a loupe so you can see all fine details of the image?

Thanks for any help on this guys

Screenshot 2021-07-23 012421.jpg

Link to comment
  • Answers 7
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Posted Images

7 answers to this question

Recommended Posts

  • 0
1 hour ago, Celisian said:

Hi, I have a series of images I want to display as big as possible when they go into lightbox mode. The problem is that lightbox has this black padding/margin that prevents the images from being brought right up to the edge of the browser window. Is there a custom code I can use to reduce that margin to get it as close to the edge of the browser as possible? 

I include a screenshot of one of my images in lightbox and the pink outline is how big I would like the image to be, magnified so that it comes very close to the edge of the browser. 

if this isn't possible then is it possible to somehow get the image to magnify all the way to 1:1 to act like a loupe so you can see all fine details of the image?

Thanks for any help on this guys

Screenshot 2021-07-23 012421.jpg

What is your current site url

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Portfolio hover Replace Link Style
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
7 hours ago, Celisian said:

www.celisian.com

What is access password?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
8 hours ago, Celisian said:

www.celisian.com

Create site wide password so we can check

Site-wide passwords – Squarespace Help

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Portfolio hover Replace Link Style
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
Posted (edited)
11 hours ago, bangank36 said:

Create site wide password so we can check

Site-wide passwords – Squarespace Help

 

12 hours ago, tuanphan said:

What is access password?

 

Sorry guys, I forgot I had a site wide password applied. I have removed the password lock. The website is not done, currently it's just this page, but it shows the images I want to make bigger when they go in to lightbox mode. Thanks for taking a look. 

https://www.celisian.com/

Edited by Celisian
Link to comment
  • 0
5 hours ago, Celisian said:

 

 

Sorry guys, I forgot I had a site wide password applied. I have removed the password lock. The website is not done, currently it's just this page, but it shows the images I want to make bigger when they go in to lightbox mode. Thanks for taking a look. 

https://www.celisian.com/

try

.gallery-lightbox {
  padding: 0;
}

image.thumb.png.dab80f1e23e458395e344ac148d89028.png

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Portfolio hover Replace Link Style
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
Posted (edited)

Hi @bangank36  I tried that Custom CSS and it worked perfectly! It did just what I wanted it to do. Thanks so much for sharing that with me. Your quick code was the solution to a problem I was trying to fix on my own for days. hehe. Much appreciated! 

 

Edited by Celisian
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...