Lightbox script conflicting with image rotator script

JavaScript
1

Hope someone can help with this…

Basically I have added a Lightbox gallery, which is all working as it should here -

http://www.goodsafariguide.com/new/gallery.php

However, the large photos can render underneath the two sets of rotating images - the ones near the top of various resorts, and the one on the left hand side showing sponsor’s logos. It only seems to do it sometimes with the set at the top, but always with the Award Sponsors one.

If it doesn’t show with the page as it loads, you can see what I mean by scrolling down until the Awards Sponsors graphic is about halfway down the screen.

So my question is really just to ask if there’s a way of ensuring that the Lightbox photos do appear over everything else on the page?

Thanks.

2

I’ve managed to partially fix this by changing this line in lightbox.css from :

#lightbox{ position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}

to

#lightbox{ position: absolute; left: 0; width: 100%; z-index: 1000; text-align: center; line-height: 0;}

So the lightbox pics do now appear in front of the Awards Sponsors graphic, but the Awards Sponsors graphic is not fading out, which it ideally should do…

3

Just to say as a temporary measure I’ve taken the Awards Sponsors graphic out of the page above, but have a copy with it still there here :

http://www.goodsafariguide.com/new/gallery2.php