Scott Wojan

DotRant BLOG
posts - 13, comments - 25, trackbacks - 5

My Links

News

Archives

Post Categories

Image Galleries

JQuery LightBox Max Height and Width

I needed lightbox 2 functionality for a project I'm working on, but didn't want the overhead of having to include prototype, scriptaculous, et al that comes with it since we are already using JQuery.  I found the excellent JQuery lightbox plugin written by Leandro Vieira Pinho and works well, but I needed to be able to set the max height and width so I had to mod the code as follows:

 

settings = jQuery.extend({
    maxWidth: null,
    maxHeight: null,

...

function _resize_container_image_box(intImageWidth,intImageHeight) {
    //rescale if necessary
    if((settings.maxWidth != null && settings.maxHeight != null) && (intImageWidth > settings.maxWidth || intImageHeight > settings.maxHeight)){
	var isWider = intImageWidth > intImageHeight;//is the image wide or tall?
	var scale = isWider ?  settings.maxWidth/intImageWidth : settings.maxHeight/intImageHeight;
	intImageWidth = intImageWidth * scale;
	intImageHeight = intImageHeight * scale;
     }

     $('#lightbox-image').height(intImageHeight); 
     $('#lightbox-image').width(intImageWidth);  

...
Now you can specify a max width and height like:
    $('.yourClass a').lightBox({
            maxHeight: 500,
            maxWidth: 700
    });

Print | posted on Wednesday, June 17, 2009 9:19 AM |

Feedback

Gravatar

# re: JQuery LightBox Max Height and Width

Thank you . It helped a lot :)
Tomas
7/1/2009 10:10 AM | Tomas
Gravatar

# re: JQuery LightBox Max Height and Width

Sweet, this came in handy and worked great. Thanks!
8/4/2009 2:15 AM | Dave D.
Gravatar

# re: JQuery LightBox Max Height and Width

Thanks so much! This is exactly what I was looking for. You should consider contacting the plugin author to have this added to future releases. Thanks again.
8/11/2009 7:49 AM | Jason Daihl
Gravatar

# re: JQuery LightBox Max Height and Width

Thank you! Works very nice.
8/25/2009 4:20 AM | Mathijs
Gravatar

# re: JQuery LightBox Max Height and Width

Thanks. Thats what I needed.
I use it with screen.height and screen.width, so the pics are always smaller than the clients screen-resolution:

$('.yourClass a').lightBox({
maxHeight: screen.height * 0.9,
maxWidth: screen.width * 0.9 });
11/18/2009 2:48 AM | Richard Martin
Gravatar

# re: JQuery LightBox Max Height and Width

Thank you. It is working perfectly.
12/11/2009 5:23 AM | Flakron Bytyqi
Post A Comment
Title:
Name:
Email:
Website:
Comment:
Verification:
 

Powered by: