What is the logic of Lightbox 2 on where to position the popup?

Question

What is the logic of Lightbox 2 on where to position the popup?

It seems that when using Firefox or Chrome it shows up in different places on different pages. Is there any setting to have it show at the same height on every page for consistency?

What is the CSS or logic it's using to determine positioning?

Answer 1

#lightbox{
position: absolute;
top: 100px !important; /*I foxed it 100px from the top, you could fix it as much pixels as you wish*/
}

Answer 2

Try turning off the animation.

Answer 3

In what way does it display on different places, what is your desired behaviour, and can you give a sample page?

Here is how the script itself calculates the top position of the popup (lightbox v2.04, zip download, js/lightbox.js, lines 229ff):

// calculate top and left offset for the lightbox 
var arrayPageScroll = document.viewport.getScrollOffsets();
var lightboxTop = arrayPageScroll[1] + (document.viewport.getHeight() / 10);
var lightboxLeft = arrayPageScroll[0];
this.lightbox.setStyle({ top: lightboxTop + 'px', left: lightboxLeft + 'px' }).show();

As the script uses Prototype's document.viewport object, the script positions the popups at 10% inside the current scroll position, like this:

------- page start
|
|
|
|
|
------- scroll position top
|
------- start of lightbox popup
|
|
|
|
|
|
|
|
------ scroll position bottom
|
|
|
|
------ page end

Answer 4

You could try Flowplayer:

http://flowplayer.org/tools/demos/index.html

You can set the positioning and size of your overlay through the CSS file to wherever you want.