1

I'm very far from an expert, but I have got the code all working pretty much how I want - I can make my galleries, and the viewport opens and displays my images, all my options work how I want etc.

What does happen which is undesirable for me is that if the web page is long enough to be scrollable, when the lightbox viewport is opened (when displaying a portrait image) is "taller" than the height of the browser window, and so you have to scroll to see the image.

I know that I could set the maxHeight option to an arbitrary number of pixels, but I would rather not do that as of course that limits people with larger screens.

Ideally, I'd like for the viewport to be the same kind of distance from the bottom of the browser window as it is from the top, resizing the image as needed (as it already does if the web page isn't scrollable).

I think what is happening is that Lightbox is using the full, scrollable height of the web page to determine the max height of the viewport and what I would like is for an option to use the browser window height instead.

This seems to be how it works on the site for Lightbox itself - http://lokeshdhakar.com/projects/lightbox2/#examples - the way that the 4 image set works is pretty much how I want mine to work (though I will have more images). I believe it's something to do with the extra screen.css that is loaded in to that page but isn't included in the examples and Lightbox archive you download, but I don't know enough CSS to be able to decode what I need from it.

Hope this all makes sense - any ideas anyone? Would really appreciate some help.

2 Answers2

1

The maxHeight of the image is counted in a file lightbox.js , line 295 (for v2.9.0):

windowHeight   = $(window).height();
To count it from a height of the browser window, replace this line with following:
windowHeight   = document.body.clientHeight;
bilekj
  • 11
  • 2
1

Make sure that your page has a valid doctype (e.g. <!DOCTYPE html>). If this is missing then Lightbox2 fails to calculate the window size correctly. (Not sure if this an issue with Lightbox2, Jquery, or Javascript overall, but I can vouch that fixing that detail solved the problem for me.

RickL
  • 524
  • 1
  • 5
  • 15