Displaying photo double its size

[mylann]

Hey, I have been using Colorbox v1.3.17.2 for years, now it was time to upgrade 😊
I have a gallery, where I need to display photos twice their size in colorbox. Eg: Photos are 400px wide, so I set colorbox to width: '800px'. In the old version everything worked fine and each photo was scaled proportionally. With the new version however the photos are shrinked down to original height. Is there a way to achieve this with the new version?

Code I'm using: $('#screenshots-gallery a').colorbox({rel:'photos', width: '800px'});

[jackmoore]

@mylann I figured there was probably some way to do this so I tooled around with it for a while and couldn't figure it out. My apologies, I think you are out of luck.

If you know the exact full dimensions of the images (for example, lets say they are all 800px wide and 600px tall), you could set Colorbox to that size and use CSS to scale the image up:

$('#screenshots-gallery a').colorbox({rel:'photos', width: 800, height: 600});

And your CSS would be:

.cboxPhoto { transform: scale(2) }

[mylann]

@jackmoore thank you for your answer. Think I'm gonna stick with the v1.3.17.2 version, since it's working as I want. Just wanted to update scripts I'm using.

I don't know the height of all images and size ratio of images can be different in gallery, so I don't want to set the fixed height.

I've got different sized images in each gallery, for example: https://www.bestoldgames.net/supaplex#screenshots - here are all the images the same height, but they are quite small (320x200) https://www.bestoldgames.net/prince-of-persia#screenshots - also same size images, but images are big (1440x900) https://www.bestoldgames.net/resurrection#screenshots - the first image is different height than the others and colorbox 1.3 still manage to display all the images correctly :)