Lightbox 2 maximum image size

[design-is]

Hi all.

I know diddly squat about javascript really... I was wondering if there was a way with Lightbox 2 to limit the size of the image that pops up and keep it in proportion.

Any help would be greatly appreciated.

I have a problem where someone keeps loading huge, uncompressed images into the system that uses lightbox and was hoping to stop them from opening a lightbox which spans 3 times larger than the browser window. I know this won't help long loading times for bloated images, but it will at least make them visible.

Cheers

Doug

 

[SrWebDeveloper]

I'll cover the major bases in this reply.

In the lightbox.css included with the download archive for 2.04 you can change the width and height to static pixel values instead of auto:

#lightbox img{ width: auto; height: auto;}

But of course all your smaller images than the dimensions you use will be distorted. CSS3 does have min-height/max-height and min-width/max-width that could be applied in the selector above, but technically CSS3 is in working draft an not supported on hardly any browsers yet.

Others here might post JavaScript hacks like this excellent cropper script to the Lightbox scripts that check the image size and conditionally set or crop style width and heights if they exceed a certain size, say browser window size.

If I was doing this, I'd focus on the upload. Once uploaded, if you support PHP with the GD library you can detect image size as well as file size or extension and reject large uncompressed files. Or resize them dynamically using GD, all done server side.

This PHP class does it all for you via GD - it's excellent (orginal colors and aspect ratio preserved)

Similar to how thumbnails are created server side. This method requires knowledge of PHP uploading and the GD library which is very common. So my official answer is don't rely on Javascript if a server side solution exists. Not everyone will agree with this because JS is "easier" - just remember my method saves you disk space as well as works across all platforms!

-jim

 

[kevindosi]

It's been two years since this has been discussed, but I was searching for the same answer. I have a lightbox gallery full of huge images, and want them to open up in a scaled down size (say, 400px width). Can anyone help out with this now?

 

[Ride9650]

It's been two years since this has been discussed, but I was searching for the same answer. I have a lightbox gallery full of huge images, and want them to open up in a scaled down size (say, 400px width). Can anyone help out with this now?

? did you not see the Jim's post above you? he pretty much covered everything.

If you're not comfortable with CSS,Javascript, or PHP, you're pretty much stuck with just resizing everything in photoshop or some other image editing program.

 

[design-is]

Wow - I posted that a while ago...