Lightbox gallery question---nooby

[baldrn]

1) Script Title: Lightbox viewer 2.30a

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

3) Describe problem:
Not a problem, just a nooby qustion:
In the setup it says:

You will need to include these three Javascript files in your header.
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

Do I need to just paste those lines into the header? That wouldn't make sense to me.

I thought I had to actually copy and past the included javascript files.I use Dreamweaver. So, I'd have to paste the javascript texts, effets, oightbox, prototype, scriptaculous into the header of the template and save it on the gallery page.

Thanks!

[jscheuer1]

You also need to download the files from the demo page. They're in the

Simply download Lightbox V2.03a, and refer to the index file inside for installation instructions. If you're merely upgrading from v2.03 to v2.03a, simply refresh the following file:

archive.

There's a demo in there too. Everything is already setup.

[baldrn]

Thanks,
I see the demo, and it looks nice. But I'm needing help in installation.
I did download those files. The js folder contains effects, lightbox, prototype and scriptaculous.

Those are the ones I'm asking about. Do I copy and paste the contents of those four files into the header as well as these other lines??

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

[jscheuer1]

No. Those are called external script tags. They're a lot like img tags. As long as the script that's referenced in their src attribute is where it says, then the script is a part of the page. Just like with an img tag, if the src attribute is correct, the image shows up on the page.

Like with the demo. For instance it has (along with the other external script tags):

<script type="text/javascript" src="js/lightbox.js"></script>

And because the lightbox.js file is in the js folder just off of the folder where the demo page is, it's as if the entire lightbox.js script were on the demo page.

It's like if you had an img tag on that page:

<img src="images/myimage.jpg">

If myimage.jpg is in the images folder just off of the folder that this page is in, it will show up.

The only real difference is that you see the image. With the script you only see the dynamic effects it makes possible.

[baldrn]

DOOD..it works! Thanks.
See, to be honest, it wasn't until I read in your post that it made sense:

And because the lightbox.js file is in the js folder just off of the folder where the demo page is, it's as if the entire lightbox.js script were on the demo page.

If anywhere on the page it says to upload the js FOLDER..I missed it.
That's a pretty important step.

Thanks man.

[baldrn]

If I could ask one more favor: the prev/next are not showing. They are in the correct dir on lightbox css.
Are they referenced anywhere else?
The close is showing up as I changed it in js lightbox.
Thanks!

[jscheuer1]

They might not be. But if they are in the right places, it might be because you're not using the group syntax.

Here's a normal lightbox link:

<a href="some.jpg" rel="lightbox">Whatever</a>

Here's one with the group syntax:

<a href="some.jpg" rel="lightbox[mygroup]">Whatever</a>

To illustrate further, here are the ones from the demo page:

<a href="sushi.jpg" rel="lightbox[sushi]"><img border="0" src="sushi_thumb.jpg" width="100" height="76"></a>
<a href="sushi2.jpg" rel="lightbox[sushi]"><img border="0" src="sushi2_thumb.jpg" width="100" height="75"></a>
<a href="sushi3.jpg" rel="lightbox[sushi]"><img border="0" src="sushi3_thumb.jpg" width="100" height="107"></a>

[baldrn]

Yup, got all of that in place. Matter of fact, at the bottom it says 1 of 2 (for right now, more later) and then Close.
But...still no prev or next.
And, if I copy and paste the url that I've referenced for the prev or next .gif from the lightbox css, the browser goes straight to the .gif, so they're out there.
Tell me please, am I supposed to change their url somewhere else? in a js file?
Thanks for your help bud.

[jscheuer1]

If you've set everything up with the same folder structure as the demo, it should work. If you've moved the next/prev images then you have to change where they're referenced in the css file, not the js file. And unlike the close image in the js file, paths in the css file are relative to the css file, not to the page.

But the easiest way is just to retain the folder structure of the demo archive. Then you don't have to change any of the paths to the helper images in any of the files.

If you want more help, put up a live demo of what you have so far and post a link to it.

[baldrn]

Fixed it,
The main css, not lightbox css, had some duplication in it. Apparantly that's enough to anger the css gods, so after removing those lines, it works now.
Great to have a forum to get help from.
Thanks Jscheuer1