Problem with Lightbox v2.03

[Steve Farillo]

1) Script Title: Lightbox v2.03

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...box2/index.htm

3) Describe problem:

Have got all the files uploaded to the server and added the lightbox CSS elements to my j5styles.css file. Loaded the lightbox images into ../images/lightbox/ and updated both the lightbox.js & css files where required.

The problem is that when the page is loading I can see the thumbnail image locations but as soon as the page loads everything goes blank.

No thumbnails to click on.

Any ideas on what I am doing wrong?

Here's the link to my page with Lightbox on it in the center area.
My Site

[jscheuer1]

http://flyonredbaron.net/jasta5/j5gblitz_thumb.jpg

Does not exist or the server will not retrieve it or display on your page. The spelling and/or upper and lower case letters used and/or the path are wrong, or it simply isn't there.

The same is true of:

http://flyonredbaron.net/jasta5/images/markmiller/j5blitz.jpg

There could also be other problems.

[Steve Farillo]

Thanks!

I went back and looked at the html coding I did and corrected a lot of mistakes and now the images are working and displaying.

But one minor problem I need help with is that the Next & Previous tabs do not appear when I move the mouse over to the sides of the large image. I do have those files loaded on the server and the loading and close images/effects do appear.

Any idea what could cause this?

May be operator error again, but I am stumped right now. lol

[jscheuer1]

First off, your site is now password protected, so I am having to work from a cached copy of your http://flyonredbaron.net/jasta5/j5styles.css file.

These paths (red):

#prevLink:hover, #prevLink:visited:hover { background: url(../images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/lightbox/nextlabel.gif) right 15% no-repeat; }

in it are most likely wrong. Just guessing (without access to the site, I can only guess) from the way that you say your site is organized, they should be:

#prevLink:hover, #prevLink:visited:hover { background: url(images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/lightbox/nextlabel.gif) right 15% no-repeat; }

In any case, the paths in the css file should be relative to the css file, not to the page that is using them, or you could use the absolute paths, which you've said are:

#prevLink:hover, #prevLink:visited:hover { background: url(http://flyonredbaron.net/jasta5/images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(http://flyonredbaron.net/jasta5/images/lightbox/nextlabel.gif) right 15% no-repeat; }

[Steve Farillo]

Ah! Ok

I found I had to make the paths absolute in the CSS file and now the previous & next tabs are showing up.

I really like this particular gallery effect, it works wonderfully and makes looking at images on a site very easy and enjoyable.

You have been a lot of help. Thank you! jscheuer1