jQuery lightbox plug-in bug

Question

If you visit here: http://www.egyptevakantie.nl/dahab, click on the "andere plaatsen" tab, and then click on an image it brings up a magnified image, courtesy of the jQuery lightbox plug-in.

However, if you do the same here http://www.egyptevakantie.nl/dahab?rhys=yes (essentially the same site except for a couple of stylesheets and one or two minor html changes, none of which are in close proximity to the images) the lightbox fails. Instead of overlaying the content the lightbox is appended to the bottom of the page, where it is also displayed weirdly.

So far in debugging I've managed to work out that the plug-in still calculates the correct left and top values for where to place the lightbox, but by the time the dhtml is generated the top value has changed completely.

Does anyone have any idea why this is happening?

Answer 1

I think you are missing the jquery lightbox stylesheet file.

in the first page there is a reference to this css file:

/css/jquery.lightbox-0.5.css

but on the second link there is no reference to this file.

this css file is included in the jQuery lightbox download located here:

http://leandrovieira.com/projects/jquery/lightbox/

Answer 2

If image is appended at bottom page, for sure postion:absolute is not set.